Question

我试图让一些jQuery代码用于菜单.. 我需要在我的第一深度<ul>

周围包裹一个<li>

我的HTML语法看起来像..

<ul>
  <li id="" class="menu-item">
     <a class="" href="#">test1</a>

    <div class="sub">
         <ul class="sub-menu">
              <li id="" class="menu-item">
                  <a class="" href="#">test2</a>
                  <ul class="sub-menu">
                      <li id="" class="menu-item"><a class="" href="">test</a></li>
                      <li id="" class="menu-item"><a class="" href="">test</a></li>
                  </ul>
              </li>   
              <li id="" class="menu-item">
                  <a class="" href="#">test3</a>
                  <ul class="sub-menu">
                      <li id="" class="menu-item"><a class="" href="">test</a></li>
                      <li id="" class="menu-item"><a class="" href="">test</a></li>
                  </ul>
               </li>    
          </ul>
     </div>
  </li>
</ul>

这是插入<ul>标签

后的样子

 <ul>
      <li id="" class="menu-item">
         <a class="" href="#">test1</a>

        <div class="sub">
             <ul class="sub-menu">
                  <ul class="drop_menu">
                  <li id="" class="menu-item">
                      <a class="" href="#">test2</a>
                      <ul class="sub-menu">
                          <li id="" class="menu-item"><a class="" href="">test</a></li>
                          <li id="" class="menu-item"><a class="" href="">test</a></li>
                      </ul>
                  </li> 
                  </ul>  
                  <ul class="drop_menu">
                  <li id="" class="menu-item">
                      <a class="" href="#">test3</a>
                      <ul class="sub-menu">
                          <li id="" class="menu-item"><a class="" href="">test</a></li>
                          <li id="" class="menu-item"><a class="" href="">test</a></li>
                      </ul>
                   </li>
                   </ul>    
              </ul>
         </div>
      </li>
    </ul>

<ul class="drop_menu">应该只包含在第一级别的... ...直到现在才找到任何解决方案..希望任何人都有一个想法..

干杯！

Answer 1

您想在li的{{1}}内{<1}}直接选择所有<div> s ：

<ul>

a > b child selector将选择$('ul > li.menu-item > div.sub > ul.sub-menu > li.menu-item')的直接子项的所有b元素。

编辑：您还在寻找.unwrap() method。

Answer 2

如果绕过第一级li，那么：

$（'ul.drop_menu＆gt; li'）。each（function（）{ //使用这个在每个li中做一些事情 }）;

Answer 3

以下jQuery应该可以解决这个问题......

$('div.sub > ul.sub-menu > li.menu-item').wrap('<ul class="drop_menu"></ul>');

jQuery包装了第一个深度li

3 个答案: