javascript - 在带有 iFrame 的页面上使用 document.getElementsByTagName - iframe 内的元素未被拾取

Question

javascript 较新。在我的页面(asp.net 应用程序，vb 作为服务器端语言)上，我使用 document.getElementsByTagName("img") 获取所有 img 标记的 html 项目。我特别注意到一个没有出现在这个列表中(我能够将它们放入一个数组并单独访问这些项目 - 下面的代码)。这个项目包含在 iframe 中(iframe 不使用 SRC 或其他任何东西，只是定义然后它里面的 html 就在源代码中，不从另一个页面加载 - 这是由生成的 Crystal 报表查看器自动生成的在运行时，这就是为什么我无法复制来显​​示它)。 getElementsByTagName 是否因为它在 iframe 中而没有拾取此图像？我需要能够访问此 img 的 src(图像是 Crystal 报表查看器中的另一个自动生成的项目)。如果未被拾取的原因是由于 iframe，是否有任何方法可以在 iframe 内的项目上运行它？或者只是获取 iframe 内所有内容的“innerhtml”类型属性，以便可以访问 img src。感谢您的帮助。

var IMGmatches = [];
        var IMGelems = document.getElementsByTagName("img");
        for (var j = 0; j < IMGelems.length; j++) {
            IMGmatches.push(IMGelems[j]);
        }

Answer 1

那是因为 iframe 中的元素不是父文档的一部分。

要在 iframe 中获取任何内容，您需要访问 iframe 的 contentDocument。因此，您的代码可能如下所示:

var IMGmatches = [], IMGelems = document.getElementsByTagName("img"),
    iframes = document.getElementsByTagName('iframe'), l = IMGelems.length,
    m = iframes.length, i, j;
for( i=0; i<l; i++) IMGmatches[i] = IMGelems[i];
for( j=0; j<m; j++) {
    IMGelems = iframes[j].contentDocument.getElementsByTagName("img");
    l = IMGelems.length;
    for( i=0; i<l; i++) IMGmatches.push(IMGelems[i]);
}