使用javascript从数组中的HTML页面捕获图像

我正在尝试使用Javascript捕获HTML页面中的所有图像。我发现了这个类似的问题，最好的答案是非常详细地给出了问题的解决方案：

我的问题是，即使我直接复制/粘贴到Firefox控制台，我也无法让最佳答案中显示的代码无误运行。我怀疑答案是直截了当的，尽管这让我挠头好几个小时了——有人能帮忙吗

这段代码在参数列表之后给出了错误“SyntaxError:missing”）

完整的解决方案，其中似乎包括上述内容，似乎也给出了相同的错误

var images = [],
    bg_images = [],
    image_parents = [];
document.addEventListener('DOMContentLoaded', function () {
    var body = document.body;
    var elements = document.body.getElementsByTagName("*");

    /* When the DOM is ready find all the images and background images
        initially loaded */
    Array.prototype.forEach.call( elements, function ( el ) {
        var style = window.getComputedStyle( el, false );
        if ( el.tagName === "IMG" ) {
            images.push( el.src ); // save image src
            image_parents.push( el.parentNode ); // save image parent

        } else if ( style.backgroundImage != "none" ) {
            bg_images.push( style.backgroundImage.slice( 4, -1 ).replace(/['"]/g, "") // save background image url
        }
    }

    /* MutationObserver callback to add images when the body changes */
    var callback = function( mutationsList, observer ){
        for( var mutation of mutationsList ) {
            if ( mutation.type == 'childList' ) {
                Array.prototype.forEach.call( mutation.target.children, function ( child ) {
                    var style = child.currentStyle || window.getComputedStyle(child, false);
                    if ( child.tagName === "IMG" ) {
                        images.push( child.src ); // save image src
                        image_parents.push( child.parentNode ); // save image parent
                    } else if ( style.backgroundImage != "none" ) {
                        bg_images.push( style.backgroundImage.slice( 4, -1 ).replace(/['"]/g, "") // save background image url
                    }
                } );
            }
        }
    }
    var observer = new MutationObserver( callback );
    var config = { characterData: true,
                attributes: false,
                childList: true,
                subtree: true };

    observer.observe( body, config );
});

---

谢谢。

您在

images.push（）

行和最后一行缺少一些右括号

不确定这是否会使您的代码实现您最终希望它实现的功能，但至少不会导致语法错误

var elements = document.body.getElementsByTagName("*");
Array.prototype.forEach.call( elements, function ( el ) {
    var style = window.getComputedStyle( el, false );
    if ( style.backgroundImage != "none" ) {
        images.push(style.backgroundImage.slice(4, -1).replace(/['"]/g, ""));
    }
});

---

许多支架未对齐且未闭合，例如

图像中的
（
）（

。您从中复制错误代码的答案不是很好，谢谢您坦率的反馈，@CertainPerformance！是语法错误本身导致您说代码不好，还是您认为它的一般功能有哪些方面可以改进？如果语法错误修复后代码仍然有效，那就足够了，我想，尽管有很多东西需要改进，但就一般代码质量而言。（例如，最好使用现代语法，将两个相同的

forEach

块抽象为一个函数，

continue

而不是一个大的

if

块，仅在使用它们的上下文中声明变量，等等。）简洁、重构、现代的代码减少了bug和输入错误的表面积Hank，Nick-这非常有帮助。根据您的回答，我一直在重新阅读代码，并注意到一些问题。我现在已经纠正了一些问题，但意识到了下半部分（从注释“MutationObserver callback在主体发生变化时添加图像”开始）将需要一些严重的解压。其中一些看起来仍然像伪代码。如果您有任何建议，我将不胜感激。谢谢。

var elements = document.body.getElementsByTagName("*");
Array.prototype.forEach.call( elements, function ( el ) {
    var style = window.getComputedStyle( el, false );
    if ( style.backgroundImage != "none" ) {
        images.push(style.backgroundImage.slice(4, -1).replace(/['"]/g, ""));
    }
});