2

我有以下 HTML：

<ul>
  <li></li>
  <li></li>
  <li></li>
</ul>

和以下 jQuery 代码：

$('> ul li', body).each(function()
{
  $('</ul><ul>').insertBefore($(this));
});

此代码应在每个列表项的前面插入一个结束标记，后跟一个无序列表的开始标记，但它会插入<ul></ul>. 这些都是错误的方法！为什么 jQuery 会这样做，有谁知道如何解决这个问题？

4

3 回答 3

4

将每个包裹li在 a 中ul并移除原始外部ul

$('ul li').wrap('').end().find('ul').unwrap('ul');

最终的html：

<body>
  <ul><li></li></ul>
  <ul><li></li></ul>
  <ul><li></li></ul>
</body>

在行动：http: //jsfiddle.net/ZyMNn/

在提示重新考虑之后，更简单的应该可以工作：

$('ul').find('li').wrap('<ul/>').parent('ul').unwrap();

更新小提琴：http: //jsfiddle.net/ZyMNn/2/

于 2013-05-13T23:53:08.620 回答
1

jQuery 将始终修复无效的 HTML。

 $('</ul><ul>')

那是无效的。您不能以结束标记开始 HTML。把那个字符串想象成一个很小的 ​​HTML 文档。它必须是有效的。

我对您要做什么感到有些困惑？你是不是想改变。

<ul>
  <li></li>
  <li></li>
  <li></li>
</ul>

进入这个？

<ul><li></li></ul>
<ul><li></li></ul>
<ul><li></li></ul>

如果是这样，那么也许是这样的。

var list = $('> ul', body);
var x = $('<div>');
$('li', list).each(function(){
    x.append($('<ul>').append($(this)));
});
list.html(x);
于 2013-05-13T23:40:34.260 回答
1

jQuery 不是在某处插入 HTML 标记。它是关于操纵 DOM 的——为了做到这一点，$('</ul><ul>')会以某种方式被解析为一个元素，然后该元素会被 insertBefore(this)。由于</ul><ul>是无效标记，您的浏览器在尝试解析它时会尽力而为，<ul/>然后将其插入到您的文档中。

于 2013-05-13T23:48:51.543 回答