Javascript 更改只有<；标签>；标记内<；李>；

我有以下html结构

<ul>
<li> 
    Text <label>1#</label> <input type="text" value="" />
</li>
    <li> 
    Text <label>2#</label> <input type="text" value="" />
</li>
    <li> 
    Text <label>3#</label> <input type="text" value="" />
</li>
    <li> 
    Text <label>4#</label> <input type="text" value="" />
</li>
    <li> 
    Text <label>5#</label> <input type="text" value="" />
</li>
<li> 
  <label>6#</label> 
</li>
   <label>7#</label> <input type="text" value="" />
</li>  
</ul>

文本1#


文本2#


文本3#


文本4#


文本5#


6# 

7# 

我需要从

li开始打破这个结构，它只有

内部标签。最终的结果是

<ul>
    <li>Text
        <label>1#</label>
        <input type="text" value="" />
    </li>
    <li>Text
        <label>2#</label>
        <input type="text" value="" />
    </li>
    <li>Text
        <label>3#</label>
        <input type="text" value="" />
    </li>
    <li>Text
        <label>4#</label>
        <input type="text" value="" />
    </li>
    <li>Text
        <label>5#</label>
        <input type="text" value="" />
    </li>
</ul>

<!-- DIVIDE -->
<ul>
    <li>
        <label>6#</label>
    </li>
    <li>
        <label>7#</label>
        <input type="text" value="" />
    </li>
</ul>

正文
1#

正文
2#

正文
3#

正文
4#

正文
5#




6#


7#

我正在尝试使用

.replace（）的一些组合不再尝试。有可能这样做吗

$（'li:not（：has（>input）））。每个（函数（）{
var myList=$（this.parent（'ul'）；
var myEls=$（this.nextAll（'li'）.andSelf（）；
myEls.remove（）；
myList.after（myEls）；
myEls.wrapAll（“
”）；
});

有点不清楚期望的结果是什么，还需要注意的是，您的HTML被破坏了：元素#7缺少一个开头
li
标记。因此，假设您想要移出第一个没有
输入的
li
和该输入之后的所有
li
元素，并将这些
li
元素放在一个单独的（新的）
ul
中，代码如下：

var x = $('<ul>').insertAfter('ul');
var y = $('ul li:not(:has(>input))');
var z = $(y).nextAll();
$(y).appendTo(x);
$(z).appendTo(x);

var x=$（'
）。插入后面的（'ul'）；
变量y=$（'ulli:not（：has（>input）））；
var z=$（y）.nextAll（）；
$（y）.附录（x）；
$（z）.附录（x）；

小提琴：
这是我的解决方案：

$("ul>li:not(:has(:not(label)))").each(function() {
    var li = $(this);   
    var newUl = $(document.createElement("ul"));
    li.parent().after(newUl);
    li.nextAll("li").andSelf().appendTo(newUl);
});

这适用于多个分隔符

这是小提琴：
我建议：

// select all the label elements:
$('label')
// filter that collection:
.filter(function () {
    // keeping only those 'label' elements that have no siblings:
    return $(this).siblings().length === 0;
})
// moving to the closest ancestor 'li' elements of those 'label' elements:
.closest('li')
// adding a specific class (for the next part):
.addClass('labelOnly')
// selecting all elements that follow, until another element with the added
// class-name is found:
.nextUntil('li.labelOnly')
// adding the original 'li' back to the selection:
.addBack()
// wrapping those 'li' elements in a 'ul':
.wrapAll('<ul></ul>')
// 'wrapAll()' returns the original (wrapped) elements, we use 'parent()'
// to get to the 'ul':
.parent()
// and append it to the body:
.appendTo('body');

//选择所有标签元素：
$（“标签”）
//筛选该集合：
.filter（函数（）{
//仅保留那些没有同级的“标签”元素：
返回$（this）.sides（）.length==0；
})
//移动到这些“标签”元素中最近的祖先“li”元素：
.最近的（'li'）
//添加特定类（对于下一部分）：
.addClass（'labelOnly'）
//选择后面的所有元素，直到添加了具有
//已找到类名：
.nextUntil（'li.labelOnly'））
//将原始“li”添加回所选内容：
.addBack（）
//将这些“li”元素包装为“ul”：
.wrapAll（“
”）
//“wrapAll（）”返回原始（已包装）元素，我们使用“parent（）”
//要获得“ul”，请执行以下操作：
.parent（）
//并将其附加到正文中：
.附于（“主体”）；


参考资料：









当然可以。您尝试过什么？每个
标签
都应该与相应的输入相关联，方法是将输入放在
标签
内，或使用
for
属性。请参阅。@isherwood我的代码已更新，以获得对OP问题的新理解。在他
代码
删除后，我如何共享我的代码？（例如：
6#
…）错误。。。对不起，我不明白你的意思
// select all the label elements:
$('label')
// filter that collection:
.filter(function () {
    // keeping only those 'label' elements that have no siblings:
    return $(this).siblings().length === 0;
})
// moving to the closest ancestor 'li' elements of those 'label' elements:
.closest('li')
// adding a specific class (for the next part):
.addClass('labelOnly')
// selecting all elements that follow, until another element with the added
// class-name is found:
.nextUntil('li.labelOnly')
// adding the original 'li' back to the selection:
.addBack()
// wrapping those 'li' elements in a 'ul':
.wrapAll('<ul></ul>')
// 'wrapAll()' returns the original (wrapped) elements, we use 'parent()'
// to get to the 'ul':
.parent()
// and append it to the body:
.appendTo('body');