Question

我有一个这样的页面

     <ul id="carousel_ul" style="left: -130px;" >

         <li><a href="#">Test 1</a></li>
         <li>
             <a href="#">Test 2</a>

             <div class="subnav">
                 <ul class="left">
                     <li><h2>JavaScript</h2></li>
                     <li><a href="#" title="JS Article 1">JS Article 1</a></li>
                     <li><a href="#" title="JS Article 2">JS Article 2</a></li>
                     <li class="last"><a href="#" title="JS Article 3">JS Article 3</a></li>
                 </ul>
                 <ul class="right">
                     <li><h2>jQuery</h2></li>
                     <li><a href="#" title="jQuery Article 1">jQuery Article 1</a></li>
                     <li><a href="#" title="jQuery Article 2">jQuery Article 2</a></li>
                     <li class="last"><a href="#" title="jQuery Article 3">jQuery Article 3</a></li>
                 </ul>
             </div>

         </li>

         <li><a href="#">Test 3</a></li>
         <li><a href="#">Test 4</a></li>
         <li>
             <a href="#">Test 5</a>

             <ul class="subnav">
                 <li class="first"><a href="#" title="The first demo">The first demo</a></li>
                 <li><a href="#" title="Another demo">Another demo</a></li>
                 <li class="last"><a href="#" title="The third demo">The third demo</a></li>
             </ul>

         </li>

         <li><a href="#">Test 6</a></li>
         <li><a href="#">Test 7</a></li>
         <li><a href="#">Test 8</a></li>
         <li><a href="#">Test 9</a></li>
         <li><a href="#">Test 10</a></li>
         <li><a href="#">Test 11</a></li>
         <li><a href="#">Test 12</a></li>

     </ul>

 </div> <!--end of div id="carousel_inner"  -->

我正在选择像这样的元素

$(document).ready(function(){

    $('#carousel_ul li:first').before($('#carousel_ul li:last'));
    ....

}); //end of $(document).ready(fn)

当 carousel_ul li 制作li数组时，它还包含所有li和li的子元素。就像第一个李变成<li><a href="#">Test 1</a></li>, <li><a href="#">Test 3</a></li>, <li><a href="#">Test 4</a></li>等等。但是当第二个李来的时候，它也包含了所有的孩子。像 Test2 li 包含 a，div，ul class = left，li，ul class = right，li 。我希望如果我的li有像 test2 li 和 test5 li 这样的子菜单。它只会像

一样选择它

 <li>
     <a href="#">Test 2</a>
 </li>

 <li>
     <a href="#">Test 5</a>
 </li>

我的意思是说虽然 li test2 和 li test5 中有子菜单，但是当行 $（'＃carousel_ul li：first'）运行，然后它将处理 li test2 和 li test5 ，如 li test1 或 li test3 。就像我选择 li test2 一样，我应该得到类似的东西

<li>
    <a href="#">Test 2</a>
</li>

<li>
    <a href="#">Test 5</a>
</li>

而不是

<li>
    <a href="#">Test 2</a>

    <div class="subnav">
        <ul class="left">
            <li><h2>JavaScript</h2></li>
            ....
        </ul>
        <ul class="right">
            <li><h2>jQuery</h2></li>
            ....
        </ul>
    </div>

</li>

<li>
    <a href="#">Test 5</a>

    <ul class="subnav">
        <li class="first"><a href="#" title="The first demo">The first demo</a></li>
        ...      
    </ul>

</li>

我该怎么办？感谢

Answer 1

您可以克隆所需的项目，然后从克隆中删除该项目。

如何在jQuery中选择元素时省略childs

1 个答案: