Chrome开发工具 - getElementsByClassName找不到元素

Question

我正在尝试使用Chrome开发工具进行一些调试。我正在查看HTML - 并在控制台中尝试使用documents.getElementsByClassName查找相应的内容 - 调用返回空集 - 而我实际上正在查看元素。我尝试复制粘贴类名 - 具有相同的结果 - 请参阅下面的屏幕截图。我错过了什么？

Answer 1

您正在获取空白nodeList，因为您正在查看iFrame中的DOM树。如果您需要访问iFrame中的节点，首先需要访问其窗口和DOM。

你可以使用以下

来做

var iframe = document.getElementById('iframeId');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
var innerWindow = iframe.contentWindow;

一旦你有了窗口和DOM，就可以在文档上调用与DOM相关的方法，或者如果你有任何其他DOM解析库，比如jQuery，它的对象存储在DOM上。您可以像使用

一样使用它

使用文件

innerDoc.getElementsByClassName('mh')

使用窗口

innerWindow.$('.mh')

Answer 2

document.getElementsByClassName返回一个数组，因此您必须指定所需元素的索引。例如：

document.getElementsByClassName("class")[0];