2009-09-24 66 views
1

我怎样才能从CSS类的背景图像(网址)加载到JavaScript变量(最好使用jQuery)?jQuery的:从CSS类加载背景图像到变量?

实施例:

.myCssClass { background-image: url(/images/checkered.gif) no-repeat; } 

...现在使用JavaScript加载checkered.gif成var CheckeredGraphic = ???

回答

3

你可以做到这一点的一种方法就是问问jQuery背景图片是什么。如果您没有类myCssClass中的任何元素,可能只需生成一个元素,而不要将其添加到DOM。

var checkeredGraphic = $('<div class="myCssClass"></div>').css("backgroundImage"); 

我没有测试过这一点,但如果它不工作,也许这与大的负边距添加到人体那么它不会在屏幕上呈现。

这线以上将返回url(/images/checkered.gif),那么你可以只使用一个正则表达式来清理:

...css("backgroundImage").replace(/url\(['"]?([^\)'"]+)['"]?\)/, "$1") 

而且,你的CSS定义是错误的。它应该是:

background-image: url(...); 
background-repeat: no-repeat; 
+0

甚至:'background:url(...)no-repeat;'。无论如何,在你的正则表达式中,你为什么要匹配引号? – mauris 2009-09-24 23:57:55

+0

,因为它可以使用'url('myfile.gif')'或'url(“myfile.gif”)',并且可以处理其中的每一个。没有伤害更健壮一点? – nickf 2009-09-24 23:59:17