Question

使用JavaScript，如何识别所有图像？

一种直接的方法是遍历所有DOM元素，并检查：1）它是否是<img />; 2）如果其样式包括background-image。

Answer 1

获取所有img元素

var allImgs = document.getElementsByTagName('img');

要检查是否有任何元素具有背景图像，我可能会尝试这样的事情：

if (element.style['background-image'] != null) {/* your code */}

我不完全确定第二个。

Answer 2

获取页面上的所有图片：

function img_tag_find()
{
    var img_collect = document.getElementsByTagName('img'); //collection of image
    var img_collect_massiv = []; //array for image 
    for (var i = 0; i < img_collect.length; i++)
    {
        img_collect_massiv.push(img_collect[i].src); // push next image
    }

    return img_collect_massiv; // return array of image
}

获取style ='background-image'的元素 - 可以作为Ramdas Nair提供

if (element.style['background-image'] != null) {/* your code */}

或尝试（通过所有元素，但不确定什么是正确的没有时间检查）

function find_backgroundImage()
{   
    var object = document.getElementsByTagName('body');
    var img_collect_massiv = []; //array for element page 
    for (var childItem in object.childNodes)
        if (object.childNodes[childItem].style['background-image'] != null)
            img_collect_massiv.push(object.childNodes[childItem]);

    return img_collect_massiv; // return all element with style = 'background-image'    
}

Answer 3

对于在CCS中定义背景图片的情况，请检查HTML元素是否具有背景图片：

window.getComputedStyle(htmlElement).backgroundImage

收集页面上所有背景图像的最佳方法是遍历所有活动CSS，以收集所有background-image引用以及对应的背景图像所应用的样式标签/类名。然后，仅选择与所有样式都匹配的HTML元素，同时确保它们不会折叠/隐藏/不显示。

如何查找网页上的所有图像，包括在后台定义的图像？

3 个答案: