javascript更改innerhtml答案

【问题标题】：javascript change innerhtmljavascript更改innerhtml
【发布时间】：2011-01-16 07:43:52
【问题描述】：

好的，我是 javascript 新手，但我试图更改 div 标签的 innerhtml，这是我的脚本，但它不起作用：

<head>
<script type="text/javascript">
function var1() {
document.getElementById('test').innerHTML = 'hi';
}
window.onLoad = var1();
</script>
</head>
<body>
<div id="test">change</div>
</body>

它应该可以工作，但由于某种原因它没有，有什么帮助吗？

【问题讨论】：

“不工作”这个短语涵盖了很多场景。究竟是什么错误？
没有错误，只是没有改变'test' div中的文本。我刚刚尝试过，如果我将 javascript 放在 div 下，它就可以工作。正如我所展示的那样，有没有办法让它在 div 上方工作？

标签： javascript innerhtml

【解决方案1】：

您当前不是将var1 分配给window.onload，而是调用该函数并存储其结果。此外，这可能很明显，但var1 似乎是一个奇怪的函数名称。试试这个：

function var1() {
  document.getElementById('text').innerHTML = 'hi';
}

window.onload = var1;

注意onload 的大小写，以及var1 后面缺少的括号。

【讨论】：

你不应该使用innerHTML，它是非标准的，也是一种不好的做法。使用 createElement、createTextNode 和 appendChild 等 DOM 方法要安全得多。

【解决方案2】：

正确：

window.onload = var1;

在您的示例中 window.onload 的值为undefined，因为函数 var1 不返回任何内容 (undefined)。您应该将 onload 属性设置为函数 var1，而不是调用函数 var1() 的结果

【讨论】：

@David：还要注意从 onLoad 到 onload 的变化。我试过了，效果很好。

【解决方案3】：

使用.innerHTML 是non-standard,，出于多种原因，这是一种糟糕的做法。您应该使用适当的标准方法创建一个新元素并将其添加到您想要的树中

【讨论】：

没有。使用innerHTML 是最快的方法。
并不意味着是不错的做法
它是非标准的，因此它可能导致未定义的行为，即：安全漏洞，因此是不好的做法。我不敢相信有人投了反对票...
只是为 Josh S 的“最快”评论添加一些上下文。stackoverflow.com/questions/18393981/…

【解决方案4】：

下面是另一个更简单的版本

<body>
 <div id="test">change</div>
  <script type="text/javascript">
   document.getElementById('test').innerHTML = 'hi';
 </script>
</body>

【讨论】：

【解决方案5】：

您将获得一个 id 为“test”的元素，但在您的 html 中没有具有该 id 的元素。但是，有一种叫做“文本”。

【讨论】：

哦，对不起，我修正了我没有从我的文本中复制和粘贴只是在这里输入的问题，我的错。但是还是不行

【解决方案6】：

如果您将“onLoad”中的大写“L”更改为小写“L”并删除您当前拥有的 var1 之后的括号，则您的示例将起作用 window.onLoad = var1();

【讨论】：

【解决方案7】：

尝试将 onLoad 更改为 onload。

函数 var1() { document.getElementById('test').innerHTML = 'hi'; } 窗口.onload = var1; // 负载

【讨论】：

使用 createElement、createTextNode 和 appendChild 等 DOM 方法要安全得多。
您可以检查一下，这并不能解决问题。您在 onload 之前执行该函数，这是无意的。
@brunoais 已更新。我试图引起注意的问题是 onload 上的 camelCase。