在jquery中为一组节点添加一个父节点

Add a parent to a group of nodes in jquery

本文关键字:添加 父节点 一个 节点 jquery 一组      更新时间:2023-09-26

所以我有以下结构:

  <h3>I.</h3>
        <ul>
            <li>1</li>
            <li>2</li>
            <li>3</li>
        </ul>
    <ol>    
        <li>1.</li>
        <li>2.</li>
        <li>3.</li>
    </ol>
    <p>Some text</p>
    <h3>II.</h3>
            <ul>
            <li>1</li>
            <li>2</li>
            <li>3</li>
        </ul>
    <p>Some text</p>
    <ol>    
        <li>1.</li>
        <li>2.</li>
        <li>3.</li>
    </ol>
    <h3>III</h3> 
    etc

我想以这样的方式添加一个div元素:

  <h3>I.</h3>
   <div>
        <ul>
            <li>1</li>
            <li>2</li>
            <li>3</li>
        </ul>
    <ol>    
        <li>1.</li>
        <li>2.</li>
        <li>3.</li>
    </ol>
    <p>Some text</p>
   </div>
    <h3>II.</h3>
   <div>
            <ul>
            <li>1</li>
            <li>2</li>
            <li>3</li>
        </ul>
    <p>Some text</p>
    <ol>    
        <li>1.</li>
        <li>2.</li>
        <li>3.</li>
    </ol>
  </div>
    <h3>III</h3> 
    etc

我设法弄清楚了如何将元素添加到下一个h3,但后来我陷入了困境。

var elements = $("h3").nextUntil("h3");
            elements.wrapAll("<div>");

由于有多个h3元素,您需要在它们上循环,并在循环中使用nextUntil()

$('h3').each(function() {
    $(this).nextUntil('h3').wrapAll('<div />');
});

小提琴示例

$('h3').each(function() {
    $(this).nextUntil('h3').wrapAll('</div>');
});

请试试这个。