1

我需要改变这个：

<div id="truc">
   <p>First</p>
      <li>Item one</li>
      <li>Item two</li>
      <li>Item three</li>

  <p>Second</p>
    <li>Item four</li>
    <li>Item five</li>
    <li>Item six</li>
</div>

进入这个：

<div id="truc">
   <p>First</p>
    <ul id="list1">
       <li>Item one</li>
       <li>Item two</li>
       <li>Item three</li>
    </ul>

   <p>Second</p>
    <ul id="list2">
       <li>Item four</li>
       <li>Item five</li>
       <li>Item six</li>
    </ul>
</div>

我尝试将 wrapAll 与 jquery 一起使用，类似这样：

$('#truc p~li').each(function() {
   $(this).wrapAll('<ul>');
});

任何建议将不胜感激:) 非常感谢！

4

1 回答 1

2

对于此特定结构，您可以使用以下内容：

$('p', '#truc').each(function() {
    $(this).nextUntil('p').wrapAll('<ul>');
});

输出（演示）：

<div id="truc">
   <p>First</p>
   <ul>
      <li>Item one</li>
      <li>Item two</li>
      <li>Item three</li>
   </ul>
   <p>Second</p>
   <ul>
      <li>Item four</li>
      <li>Item five</li>
      <li>Item six</li>
   </ul>
</div>

至于 ID，您可以（演示）：

$('p', '#truc').each(function(i) {
    $(this).nextUntil('p').wrapAll($('<ul>', {id: 'list' + (1 + i)}));
});

您原始方法的问题：

$('#truc p~li').each(function() {
   $(this).wrapAll('<ul>');
});

是选择器#truc p~li对所有 <li>元素进行了数学运算（不是每个元素的分组<p>），因此用一个元素包装了匹配（元素）中的每个项目。<li><ul>

于 2011-11-17T08:46:05.620 回答