Javascript innerHTML 基础问题

Question

我正在尝试使用 Javascript innerHTML 属性将字符串插入 HTML。但它不起作用。我一开始用showtime()函数试了一下，我在前面加上了window.onload，因为它不起作用。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script>
  window.onload = function Hello() {
  var timeArea = document.getElementById("time");
  var text = "Hello";
  timeArea.value = text;
};
Hello();
</script>
</head>
<body>
<div id="time">
   What time is it?
</div>
</body>
</html>

Answer 1

而不是 .value 使用 .innerHTML 你试图在 html.

中插入文本

.value 用于输入类型而不是 html 标签，并且不在 html 标签内插入文本。

window.onload = function Hello() {
  var timeArea = document.getElementById("time");
  var text = "Hello";
  timeArea.innerHTML = text;
};

<div id="time">
   What time is it?
</div>

同时删除 window.onload 之后调用的 hello() 函数。 window.onload会自动执行hello函数

Answer 2

这是因为 Div 个元素没有值属性。如果您想插入一些文本，您需要将代码更改为：

<script>
    window.onload = function Hello() {
        var timeArea = document.getElementById("test");
        var text = "Hello";
        document.getElementById("test");
        timeArea.textContent = text;
        };
</script>
    <div id="time">
       <p id="test">

       </p>
    </div>

我创建了一个P元素，你可以随意修改它的文字，打印在p中。您可以使用任何其他元素作为 H1、H2 等。

textContent select 来自该元素的文本并使其等于变量文本打印它的值。

我知道这个问题已经得到解答，但这只是另一种方式。

Javascript innerHTML 基础问题

Javascript innerHTML basic issue

html

javascript

innerhtml