使用jquery来分组元素(using jquery to group elements)

使用jquery来分组元素(using jquery to group elements)

我有很多我需要分组的元素，但是因为它正在吐出一些我无法改变的机制，所以我需要使用jquery（我非常熟悉基础知识）

基本上我有一个p标签和div放在一个表单元素（很糟糕的标记，但这是另一个故事）的负载。 我需要在字段集中将下列一个或两个div分组为p标签。

我已经尝试插入fieldset close，然后在每个p元素之前开始标记，但是我猜想把它排序出来的机器想要插入合法元素，这样不起作用

I've got a whole bunch of elements that I need to group, but because it's being spat out of some machinery which I can't alter, I need to do so using jquery (which I'm fairly familiar with the basics of)

Basically I've got a load of p tags and divs loose inside a form element (yes bad markup, but that's another story). I need to group the p tags with the following one or two divs inside a fieldset.

I've tried inserting fieldset close and then start tag before each p element, but I guess the machinery that sorts it out wants to insert legal elements, so that doesn't work

最满意答案

如果我理解正确，你有一个文件，其中的标记看起来像这样：

<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> .....

如果是这种情况，那么这个jQuery代码片段就可以做到这一点：

$(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); }); });

If I understand correctly, you have a document where the markup looks something like this:

<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>

And you want to end up with something like this:

<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> .....

If this is the case, then this jQuery snippet will do the trick:

$(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); }); });