删除JavaScript中的所有标签元素

Question

在我的应用程序中，我检查用户的浏览器是否支持 HTML5 并且能够在输入字段中显示 占位符（使用 Modernizr）。如果是这样，我想以自动方式从 HTML 文档中删除所有

labels

，但我真的不知道如何。

通俗地说，如果用户的浏览器支持占位符，我想把它变成：

<label for="email">
  Email:
</label>
<input type="email" id="email" placeholder="Your email">

进入这个-在每一次发生-：

<input type="email" id="email" placeholder="Your email">

我所拥有的就是：

if (Modernizr.input.placeholder) {
  // Remove all labels from the HTML document
}

到目前为止，我将

id

分配给标签并将它们一一删除，但我想要一种更有效的方法来做到这一点。

Answer 1

首先，构建现有标签的表格，如下所示：

var labels = {}, tags = document.getElementsByTagName('label'), l = tags.length, i;
for( i=0; i<l; i++) labels[tags[i].getAttribute("for")] = tags[i];

接下来，查找具有占位符的输入元素。对于那些有 ID 的人，请查找并删除相关标签。

tags = document.getElementsByTagName('input');
l = tags.length;
var lb;
for( i=0; i<l; i++) {
    if( !tags[i].getAttribute("placeholder")) continue;
    if( lb = labels[tags[i].id]) lb.parentNode.removeChild(lb);
}

完成！ 不需要 jQuery！（因为实际上可以用原始 JS 做一些事情......）

Answer 2

如果你可以使用 jQuery，这是一句简单的话：

$('label').remove();

这里的例子 - 取消注释 JavaScript 部分中的一行以查看效果：

• http://jsfiddle.net/t42qs/

Answer 3

找不到任何相关问题让我发布这个可能有帮助的答案。如果有人想通过 jquery 删除特定的标签：

<label for="billing_wooccm15" class="">Snacks&nbsp;<abbr class="required" title="required">*</abbr></label>


$('label[for="billing_wooccm14"]').css({
'margin-top': '-15px',
'padding' : '0'
});