如何通过javascript更改html输出？_Javascript_Html

如何通过javascript更改html输出？

javascript html

如何通过javascript更改html输出？,javascript,html,Javascript,Html,如果已经有人问过这个问题，我真诚地道歉，但是我对这个问题还比较陌生，在网上找不到答案我正在学习如何将javascript与html结合使用，并试图根据用户输入的内容更改html输出。像这样的事情： <!DOCTYPE html> <html> <script> function showCost() { var registrationJS = document.forms["myForm"]["registration"].value;

如果已经有人问过这个问题，我真诚地道歉，但是我对这个问题还比较陌生，在网上找不到答案

我正在学习如何将javascript与html结合使用，并试图根据用户输入的内容更改html输出。像这样的事情：

<!DOCTYPE html>
<html>

<script>
function showCost() {
    var registrationJS = document.forms["myForm"]["registration"].value;
    var adsJS = document.forms["myForm"]["ads"].value;
    var cost = 0;
    if (registrationJS == "premium") {
        cost += 50;
    }
    if (ads == "yes") {
        cost += 2;
    }
    cost = '$'+cost;
    document.write(cost);
}
</script>

<head>
</head>

<body>
<form name="myForm" method="post">
Registration:<select id="registration">
    <option value="premium">Premium</option>
    <option value="free">Free</option>
</select>

Pay to get rid of ads?<br>
<input type="radio" id="ads" value="yes">Yes<br>
<input type="radio" id="ads" value="no">No<br>

Cost: <-- display cost -->
<script>showCost(); <-- ???? --> </script>
</form>
</body>
</html>

基本上，我如何才能使其显示成本，以及如何使其在每次更改其中一个输出时更新，从而显示新的成本

顺便说一句，我知道，如果我让它的溢价，然后免费它不会回去了，我只是想得到的html部分和语法的基础知识。。。谢谢

做一个div：

Cost: <div id = "cost"></div>

要使用用户输入进行更新，请使用合适的事件处理程序：

以下是一种方法，即使用事件侦听器

功能选择{ 功能显示成本{ 风险价值成本=0；如果选择值==溢价{ 成本+=50； } 如果inp[0]，则选中{ 成本+=2； } 成本=“$”+成本； document.getElementById'cost'.textContent=cost； } 展示成本； sel.ADDEVENTLISTER'change'，函数E{ 肖科斯特； } 对于变量i=0；i非常感谢你的回答。。。那个么有些东西会起作用吗？不。你们必须得到改变时选择的值，然后做出一个逻辑。为您发布了答案，无论您做什么，都不要开始使用内联脚本，比如onblur=。。。或者onchange=…，它更强大，更容易维护我的展示方式。

document.getElementById('cost').innerHTML = cost;