javascript - (Jquery) 从 load[ed]() HTML 元素样式中获取背景图像路径

Question

我正在处理我公司的网页。这是我的第一个严肃的网页，每一行都有很多疑问。现在我正在研究一个新闻加载系统，但我有一个无法解决的问题:

我正在使用 jquery 加载我的新闻，将元素附加到先前定义的变量:

var newArticle = $('<a href="'+path + i +'.html"><div id="news-article"></div></a>');

var newArticleChild = newArticle.children(); //'cause i want to load articles inside #news-article, not <a></a>

var image = $('<div></div>');
var title = $("<div></div>");
var tag = $("<div></div>");

$(image).load(path + i + ".html #main-image");
$(title).load(path + i + ".html h1");
$(tag).load(path + i + ".html #tag");       

$("#news").append(newArticle); //Apend articles parent to an existing page element

newArticleChild.append(image);
newArticleChild.append(title);
newArticleChild.append(tag);

HTML --------------

<div id="main-image" style="background-image: url(../../assets/images/NewsBackgroundTry.png);
"></div>

我不太喜欢这个，因为它创建了空的 div，里面还有另一个 div，但这本身并不是一个错误。

我真的不需要将图像附加到我的页面，因为我想要的是它的样式，它包含 css 中图像的路径。我这样做是因为我需要应用 background-size: cover;该图像的样式。

我的问题是，如何从图像变量中获取背景图像样式？我已经尝试了很多东西并查看了尽可能多的帖子，但我无法获得这个值......

如果解决方案可以防止将图像附加到页面，那就更好了。

谢谢大家，亚伯!

Answer 1

您可以使用 var bgImg = image.css('background-image'); 获取该 css 属性，然后替换讨厌的 url(' ') 部分只获取图像路径。