0

我使用具有不同 bg 类的 div 容器，例如：

<!--Recipes-->
    <div class="PozVideos BgBlue RadiusTopTen">
        <div class="Caption">Yemek tarifleri</div>
        <ul>
            <li><a href=""><img src="" alt=""></a></li>
            <li><a href=""><img src="" alt=""></a></li>
            <li><a href=""><img src="" alt=""></a></li>
            <li><a href=""><img src="" alt=""></a></li>
            <li><a href=""><img src="" alt=""></a></li>
            <li><a href=""><img src="" alt=""></a></li>
        </ul>
    </div>
    <!--Recipes-->
<!--Videos-->
<div class="PozVideos BgPurple RadiusTopTen">
    <div class="Caption">Video Galeri</div>
    <ul>
        <li><a href=""><img src="" alt=""></a></li>
        <li><a href=""><img src="" alt=""></a></li>
        <li><a href=""><img src="" alt=""></a></li>
        <li><a href=""><img src="" alt=""></a></li>
        <li><a href=""><img src="" alt=""></a></li>
        <li><a href=""><img src="" alt=""></a></li>
    </ul>
</div>
<!--Videos-->
<!--Gallery-->
<div class="PozVideos BgYellow RadiusTopTen">
    <div class="Caption">Fotoğraf Galerileri</div>
    <ul>
        <li><a href=""><img src="" alt=""></a></li>
        <li><a href=""><img src="" alt=""></a></li>
        <li><a href=""><img src="" alt=""></a></li>
        <li><a href=""><img src="" alt=""></a></li>
        <li><a href=""><img src="" alt=""></a></li>
        <li><a href=""><img src="" alt=""></a></li>
    </ul>
</div>
<!--Gallery-->

例如，如何为每个添加另一个不同的背景类<li>；

  • 如果 PozVideos 类有 BgYellow 类，我想在这个 div.containner(PozVideos) 中为每个 li 元素添加 BgYellowForLi 类。

  • 如果 PozVideos 类有 BgPruple 类，我想在这个 div.containner(PozVideos) 中为每个 li 元素添加 BgPurpleForLi 类。

jQuery可以做到吗？

4

5 回答 5

5 
$('.PozVideos.BgYellow li').addClass('BgYellowForLi');

但是你最好改变你的 CSS：

.PozVideos li {
    /* styles that apply for all li's in any PozVideos */
}

.PozVideos.BgYellow li {
   /* styles that apply only to yellow li's */
}
于 2012-11-16T10:27:27.123 回答
4 
$('.PozVideos.BgYellow').find('li').addClass('BgYellowForLi');

$('.PozVideos.BgPruple').find('li').addClass('BgPurpleForLi');

您甚至可以编写代码更像他们描述您想用一些 if 语句做什么的方式

var $yellowElem = $('.PozVideos.BgYellow li');
if($yellowElem.length > 0) {
  $yellowElem.addClass('BgYellowForLi');
}
于 2012-11-16T10:27:37.603 回答
0

是的，这是可能的，而且并不复杂：

“如果 PozVideos 类有 BgYellow 类，我想在这个 div.containner(PozVideos) 中为每个 li 元素添加 BgYellowForLi 类”：

$('.PozVideos.BgYellow li').addClass('BgYellowForLi');

“如果 PozVideos 类有 BgPruple 类，我想在这个 div.containner(PozVideos) 中为每个 li 元素添加 BgPurpleForLi 类”：

$('.PozVideos.BgPurple li').addClass('BgPurpleForLi');
于 2012-11-16T10:29:18.403 回答
0

动态解决方案：

$('#PozVideos').each(function(){

    var classList = $(this).prop('class').split(/\s+/);

    $(this).find('li').addClass(classList[1] + 'ForLi');
});
于 2012-11-16T10:29:58.080 回答
0

这也可以这样实现：

var bgParent = $('.BgYellow');

$('li',bgParent).css({"background":"blue"});
于 2012-11-16T10:30:20.607 回答