javascript - 你如何从 javascript HTMLCollection 中获取元素

标签 javascript

我不明白为什么我不能从 HtmlCollection 中获取元素。此代码示例:

 var col = (document.getElementsByClassName("jcrop-holder"));
 console.log(col);

在控制台上产生这个输出:

enter image description here

我正在尝试获取 dic.jcrop-holder 对象,但我无法从我的变量 col 中获取它。这些都不起作用:

  console.log(col[0]); // undefined
  console.log(col.item(0)); // null

  // check length of collection

  console.log(col.length); // 0

那么如果长度为 0 为什么控制台显示长度为 1,以及里面的对象?当我打开它包含子节点的节点时。怎么回事?

这里是一些展开的节点。我没有扩展 div.jcrop.holder 因为它太长了。以下是子元素:

enter image description here

最佳答案

取自:Can't access the value of HTMLCollection

问题是您将脚本放在 header 中,该 header 会在加载 html 元素之前执行,因此 getElementsByClassName() 不会返回任何元素。

一个解决方案是等待加载 html 元素然后执行脚本,为此您可以使用窗口对象加载事件

window.addEventListener('load', function () {
var eles = document.getElementsByClassName('review');
console.log(eles);
console.log(eles.length);
console.log(eles[0]);
})

或者您可以将脚本放在 body 元素的底部而不是 head 中,以便在解析和执行脚本时将元素加载到 dom 中

关于javascript - 你如何从 javascript HTMLCollection 中获取元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32905183/

相关文章:

javascript - 在特定的可滚动 div 上应用 skrollr

javascript - UDP 流到 webRTC

javascript - 我的 ng-change 没有在我的 Angular/Rails 应用程序上触发

javascript - 如何在不使用 jQuery 的情况下创建一个简单的页面垂直滚动条?

javascript - Ruby on Rails 运行 javascript 代码

javascript - 我怎样才能使这个点击计数器正常工作?

javascript - 使用适用于 Node.js 的 AWS 开发工具包将二进制文件上传到 S3

javascript - 从 HTML 表格 JavaScript 推送

javascript - 从 ngOnInit 向函数传递值

javascript - 从 JQuery 模态对话框获取值提交到另一个输入类型