使用JQuery选择dom并更改它

Question

我的HTML代码是:

<h2>123</h2>
<p>123</p>
<h3>123<h3>
<p>123</p>
<h2>456</h2>
<p>123</p>
<h3>123<h3>
<p>123</p>
<h2>456</h2>
<p>123</p>
<h3>123<h3>
<p>123</p>

我希望他们是这样的:

<div>
    <h2>123</h2>
    <p>123</p>
    <h3>123<h3>
    <p>123</p>
</div>
<div>
    <h2>456</h2>
    <p>123</p>
    <h3>123<h3>
    <p>123</p>
</div>

并且页面不会更改,只会更改标记

如何使用Jquery？

Answer 1

您可以使用nextUntil()对元素进行分区,并使用wrapAll()创建周围的<div>元素:

$("h2").each(function() {
    $(this).nextUntil("h2").andSelf().wrapAll("<div></div>");
});