javascript - 使用 JavaScript 获取 CSS 背景图片路径

Question

请您解释一下，我如何使用 javascript 或 jQuery 获取通过 css(例如，background:ulr())添加的 html 元素样式的正确路径。

var img = document.querySelectorAll('*');
img.forEach(function(i){
   var imageSrc = new Image(); 
     i.addEventListener("mouseover", function(e){

      if(i.style.background){

        }
    })
});

i.style.background 能否找到正确的 css DOM 路径？我添加了一个 fiddle 。 https://codepen.io/saifudazzlings/pen/VQvooy

Answer 1

HTMLElement.style只会给你一个元素的内联样式的结果。如果你需要获取从外部样式表计算出来的样式，你需要使用 Window.getComputedStyle :

var bgImage = window.getComputedStyle(i).backgroundImage;

查看更新的 codepen here使用 Window.getComputedStyle。当您将鼠标悬停在具有背景的 div 上时，将打印背景图像 URL。