我有一堆元素需要分组,但由于这些元素是从某些不可修改的机器中输出的,因此我需要使用jquery(我对其基础比较熟悉)来完成。基本上,我在一个表单元素中有许多松散的p标签和div标签(是的,这是糟糕的标记,但这是另一个故事)。我需要将带有以下一两个div标签的p标签分组到fieldset中。我尝试在每个p元素之前插入fieldset结束标记,然后再插入开始标记,但我猜整理它的机器想要插入合法的元素,所以那行不通。
如果我理解正确,您有一个文档,其中标记看起来像这样:
<p>paragraph 1</p>
<div>par1 div1</div>
<div>par1 div2</div>
<p>paragraph 2</p>
<div>par2 div1</div>
<div>par2 div2</div>
<p>paragraph 3</p>
<div>par3 div1</div>
<p>paragraph 4</p>
<div>par4 div1</div>
您希望最终得到类似于这样的结果:
<fieldset>
<p>paragraph1</p>
<div>par1 div1</div>
<div>par1 div2</div>
</fieldset>
<fieldset>
<p>paragraph2</p>
<div>par2 div1</div>
<div>par2 div1></div>
</fieldset>
.....
$(function(){
$('p').each(function(index,item){
var nextDiv = $(item).next();
var followingDiv = $(nextDiv).next('div');
$(item).wrap("<fieldset id='fieldset" + index + "'></fieldset>");
$("#fieldset"+index).append(nextDiv).append(followingDiv);
});
});
@JoseBasillo的回答可以简化和概括一下:
var $wrapper = $('#wrapper');
$wrapper.children('p').each(function(index,item) {
var $following = $(item).nextUntil('p, fieldset');
$wrapper.append($('<fieldset>').append(item, $following));
});
这段代码将进行转换。
<div id="wrapper">
<p>paragraph 1</p>
... (whatever but p or fieldset)
<p>paragraph 2</p>
... (whatever but p or fieldset)
... (p followed by whatever but p or fieldset)
</div>
转换成
<div id="wrapper">
<fieldset>
... (whatever but p or fieldset)
</fieldset>
<fieldset>
... (whatever but p or fieldset)
</fieldset>
... (fieldset containg [p followed by whatever but p or fieldset])
</div>
$following
:var $wrapper = $('#wrapper');
$wrapper.children('p').each(function(index,item) {
$wrapper.append($('<fieldset>').append( item, $(item).nextUntil('p, fieldset') ));
});