JavaScript 和 HTML 赋值 .getElementById 和 .innerHTML

Question

作业让我按照说明一步一步地使用 HTML 按钮执行代码，然后是 getElementById 和 innerHTML JavaScript。我让按钮部分工作，但我无法让 JavaScript 工作。

这是我的代码主体：

<body>
    <script type="text/javascript">
        var x= "JavaScript is fun. ";

        document.writeln(x);

        document.writeln(x + x + x + x + x);

        function statement(x)
        {
            return document.writeln(x);
        }   

        document.getElementById("change").innerHTML = x+x+x+x+x;
    </script>

    <button onclick="statement(x)">Click me!</button>
    <p id="change">This will change</p>

</body>

这是我得到的说明：

因此，如果我们想在按钮下方打印出 JavaScript 很有趣，我们可以不让它写入文档本身，而是让它替换一个文本中的一些文本文档中的某个元素（HTML 标签）。
所以在按钮下面，我们放一个段落标签，写成“这会改变”
我们将更改此标签的内部HTML 属性。标签的内部HTML 是开始标签和结束标签之间的内容，在本例中是文本“这将改变”
首先，我们需要在 JavaScript 内确定我们要更改的标签。我们可以使用 getElementById() 方法来做到这一点。此方法简单地定位具有指定 id 的元素（类似于页内链接）。因此，在开头段落标记中放置一个 id 属性（即），然后将相同的 id 放置在 () 中（即 getElementById(“change”).
再一次说过我们要改变这个元素的innerHTML属性，所以我们把innerHTML属性附加到通过说 getElementById(“change”).innerHTML
并非我们需要做的只是说明此元素与哪个对象相关联。它在文档中，所以我们可以使用文档对象并通过说 document.getElementById(“change”).innerHTML
现在我们已经确定了要更改的内容，让我们更改它。我们通过将我们想要更改的内容设置为等于新值来做到这一点，所以对我来说它是：document.getElementById(“change”).innerHTML = x+x+x+x+ x;

Answer 1

试试这个：

var x = "JavaScript is fun. ";

function statement(x) {
  document.getElementById("change").innerHTML = x + x + x + x + x;
}

<body>

  <button onclick="statement(x)">Click me!</button>
  <p id="change">This will change</p>

</body>

JavaScript 和 HTML 赋值 .getElementById 和 .innerHTML

JavaScript and HTML Assignment .getElementById and .innerHTML

html

javascript

innerhtml

getelementbyid