Question

我想在纯文本周围打一个标签，这些标签没有什么东西可以轻易地定位它。

例如，这个：

<div class="checbox">
    <input type="checkbox">
     some text
</div>

应该成为：

<div class="checbox">
    <input type="checkbox">
     <label>some text</label>
</div>

如果我可以修改HTML，这将是微不足道的，但我不能。

使用jQuery我怎么能用标签包装这个“一些文本”？

Answer 1

如果html结构是常量，那么你想用class checkbox

包装div的最后一个子节点

$($('.checbox')[0].lastChild).wrap('<label />')

label {
    color: red
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="checbox">
    <input type="checkbox" />
     some text
</div>

如果您有多个这样的元素，那么

$('.checbox').each(function(){
  $(this.lastChild).wrap('<label />')
})

label {
    color: red
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="checbox">
    <input type="checkbox" />
     some text
</div>
<div class="checbox">
    <input type="checkbox" />
     some text 2
</div>

Answer 2

请参阅http://jsfiddle.net/zxhcb6sw/

它会将所有文本节点包装在div中：

$( ".checbox" )
.contents()
.filter(function() {
    return this.nodeType === 3;
})
.wrap( "<label></label>" );

jQuery在纯文本周围包装标签

2 个答案: