我使用 jquery 的目的如下。
我选择 z-index 小于 100 的 div,然后用蓝色类 div 包围这些 div 内部的 img 元素。
jQuery(function($) {
$(".contentHolderUnit").each(function()
{
if($(this).css("z-index") < 100)
{
$("img").wrap('<div class="blue" />');
//$("img").css({"opacity": "0.75"});
}
});
});
真正发生的情况是,页面上的每个 img 元素都被选中,并且由于某种原因被 3 类蓝色 div 包围。
目标 div 之一: ( z-index 为 100 且未被过滤掉,以及 3 个蓝色类 div)
<div class="contentHolderUnit" rel="0" id="contentHolderUnit_0" style="display: block; height: 385px; width: 520px; left: 240px; top: 15px; z-index: 100; opacity: 1;"> <div class="blue"><div class="blue"><div class="blue"><img src="any" style="height: 385px; width: 520px; opacity: 0.75; display: inline-block;"></div></div></div><div class="car">
Example Title
</div></div>
最佳答案
您在每次迭代时选择 DOM 中的所有图像,而不仅仅是具有 z-index 等的元素内的图像。我只使用过滤器和 find() 而不是循环:
jQuery(function($) {
$(".contentHolderUnit").filter(function(i, el) {
return el.style.zIndex < 100;
}).find('img').wrap('<div class="blue" />')
.css({opacity: 0.75});
});
关于jquery - 过滤问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16525311/