jQuery - 使用父ID在类中选择子项。

时间:2012-10-25 10:00:36

标签: jquery jquery-selectors

我正在使用MCustomScrollBar,但页面上有多个滚动条实例。我需要能够定位.mCSB_container以便动态地将<li>元素附加到每个滚动条。

This本质上是同一个问题,但是接受的答案是行不通的,因为它试图使用attr来获取id,其中类没有id。

<div id="titles" class="scroll-box" style="opacity: 1; ">

    <h2>Latest Titles</h2>
    <ul class="scroll-horizontal mCustomScrollbar _mCS_1">
         <div class="mCustomScrollBox mCSB_horizontal" id="mCSB_1" style="position:relative; height:100%; overflow:hidden; max-width:100%;">
             <div class="mCSB_container" style="position: relative; left: 0px; width: 2860px; ">
                 <li class="product-car"> My Car</li>
                 <li class="product-bike"> My Bike </li>
                 <li class="product-tree"> My Tree </li>
             </div>
         </div> 
    </ul>

 </div>

    <h2>Latest Houses</h2>
    <ul class="scroll-horizontal mCustomScrollbar _mCS_2">
         <div class="mCustomScrollBox mCSB_horizontal" id="mCSB_2" style="position:relative; height:100%; overflow:hidden; max-width:100%;">
             <div class="mCSB_container" style="position: relative; left: 0px; width: 2860px; ">
                 <li class="product-house"> My House</li>
                 <li class="product-boat"> My Boat </li>
                 <li class="product-tree"> My Tree </li>
             </div>
         </div> 
    </ul>

 </div>

所以我尝试过玩jQuery children,但无济于事。

1 个答案:

答案 0 :(得分:12)

要附加到您的第一个滚动条,请按ID #mCSB_1找到它,然后使用child selector >转到您想要的容器,如下所示:

$('#mCSB_1 > .mCSB_container').append('<li class="product-tree"> New LI </li>');

并且对于您的第二个滚动条执行相同的操作,但对于ID #mCSB_2

$('#mCSB_2 > .mCSB_container').append('<li class="product-tree"> New LI </li>');