Question

我的标记像ul里面的一些li。就像这样。

<ul id="menu">
<li class="test"><a href="#">dhsd</a></li>
<li class="test"><a href="#">sdghds</a></li>
- - - - - - - - - - - - -- - - - -
- - - -- - - - - - -- -- - - - -- -
<li class="lang-switch language_en"><a href="#">en</a></li>
<li class="lang-switch language_es"><a href="#">es</a></li>
<li class="lang-switch language_de"><a href="#">de</a></li>
<li class="lang-switch language_ja"><a href="#">ja</a></li>
</ul>

从这里可以看出，经过多次li后，最后四个都有了类名lang-switch。我想将那些类为lang-switch的li包装起来。所以我的标记应该是这样的

<ul id="menu">
<li class="test"><a href="#">dhsd</a></li>
<li class="test"><a href="#">sdghds</a></li>
- - - - - - - - - - - - -- - - - -
- - - -- - - - - - -- -- - - - -- -
<ul class="listing">
  <li class="lang-switch language_en"><a href="#">en</a></li>
  <li class="lang-switch language_es"><a href="#">es</a></li>
  <li class="lang-switch language_de"><a href="#">de</a></li>
  <li class="lang-switch language_ja"><a href="#">ja</a></li>
</ul>
</ul>

所以要添加一个包装，我就像这样做了一个jquery

 jQuery(document).ready(function() {
    var LangList = jQuery('ul#menu').find('li.lang-switch');
    jQuery(LangList).wrap('<ul class="test"></ul>');
  });

但是这个就像这样做了

<ul class="test">
  <li class="lang-switch language_en"><a href="#">en</a></li>
 </ul>
  <ul class="test">
  <li class="lang-switch language_es"><a href="#">es</a></li>
 </ul>
  <ul class="test">
  <li class="lang-switch language_de"><a href="#">de</a></li>
 </ul>
  <ul class="test">
  <li class="lang-switch language_ja"><a href="#">ja</a></li>
 </ul>

所以有人可以告诉我如何使用相同的类对这些列表进行换行。

Answer 1

使用.wrapAll()

var LangList = jQuery('ul#menu').find('li.lang-switch');
LangList.wrapAll('<ul class="test"></ul>');

Working JSFiddle

正如Rajaprabhu Aravindasamy所指出的那样，你不需要再将LangList转换为jQuery对象，因为它已经是一个jQuery对象了。

Answer 2

尝试使用.wrapAll()，

  jQuery(document).ready(function() {
    var LangList = jQuery('ul#menu').find('li.lang-switch');
    LangList.wrapAll('<ul class="test"></ul>');
  });

Answer 3

在jquery中使用 wrapAll

 $(".lang-switch").wrapAll("<div class=listing></div>");

jQuery包装列表元素

3 个答案:

DEMO