Question

我对javascript / html有疑问。

首先，我有这个：

var post = document.body.getElementsByClassName("post");  
var x=post[i].getElementsByClassName("MyDiv")[0].innerHTML;

我从调试器得到x 未定义，但它不存在。

此javascript函数运行正文的onload。我确信我在我的javascript中提供了正确的类名，所以它应该找到我的div。

所以，我在某处读到有时javascript找不到元素因为还没有，它还没有在浏览器中创建（无论这意味着什么）。

由于这个原因，我的函数是否有可能找不到具有该类名的div？

有解决方案吗？

Answer 1

好的，而不是用函数调用函数 body onload，使用jQuery的ready()函数，或者，如果你不想使用jQuery，你可以使用纯javascript，但这取决于你：

// jQuery
$(document).ready(function() {
    var post = document.getElementsByClassName("post"),
    x = post[i].getElementsByClassName("MyDiv")[0].innerHTML;
});

// JavaScript
window.onload = function initialization() {
    var post = document.getElementsByClassName("post"),
    x = post[i].getElementsByClassName("MyDiv")[0].innerHTML;
}

一些附注，我不知道innerHTML的用途是的，如果你正在使用i进行for循环，那么肯定发布那段代码，这很重要。

经过一番讨论后，我的回答似乎对你有用，但你也可以将你的脚本放在body标签的末尾，就像@RobG建议的那样。

Answer 2

所以，我读到某个地方，有时javascript找不到元素，因为它还没有，它还没有在浏览器中创建（无论这意味着什么）。

浏览器在获得标记时逐步创建DOM。遇到脚本元素时，在脚本运行时，标记的所有处理都会停止（除defer and async生效之外）。如果脚本试图访问尚未创建的元素（可能是因为它的标记尚未处理），则无法找到它。

这个javascript函数运行在身体上。

如果这意味着您使用的是：

<body onload="someFn()"...>

或者

<script>
  window.onload = function() {
    someFn();
    ...
  }
</script>

然后在调用函数时，所有DOM节点都可用。有些像图像一样可能没有完全加载，但是它们的元素已经被创建了。

如果这意味着您在正文中有脚本且未使用load事件，则应将脚本移至页面底部（例如，在结束body标记之前）并查看是否能解决问题。

在javascript运行之前不会创建Div

2 个答案: