如何使用没有名称或ID的javascript替换标签中的文本？

Question

我正在使用datatables jquery插件来美化我的表格。我正在尝试将搜索框设置为更像这样的

然而，数据表中当前搜索框的 javascript生成代码看起来像这样

<div class="dataTables_filter" id="countstable_filter">
    <label>Search: 
          <input type="text" aria-controls="countstable" placeholder="Search">
    </label>
 </div>

我能够通过javascript向搜索框添加占位符属性。但我无法弄清楚如何删除搜索：文本。我在google上看到了一些解决方案，但他们要求标签上有一个我没有的ID。

Answer 1

由于您使用的是DataTable，您还可以通过更改语言变量Search:来关闭sSearch字符串，请参阅oLanguage.sSearch和jsBin上的更多文档。

$("#someTable").dataTable({
  oLanguage: {
    sSearch: ""
  }
});

Answer 2

您可以使用以下命令删除包含Search:的文本节点：

$("#countstable_filter label").contents().first().remove();

.first()是因为它是标签的第一个节点（文本节点）。 .contents()和.first()等函数使您无需ID即可查找节点（遍历DOM）。从本质上讲，你从一个元素开始，用特定的函数遍历DOM，直到你到达想要的元素。

Answer 3

var x=document.getElementsByTagName("input");
for(var i=0;i<x.length;i++){
    var obj = x[i];
    if(obj.getAttribute("type")=='text' && obj.getAttribute("aria-controls")=='countstable' && obj.getAttribute("placeholder")=='Search'){
    // do stuff with the object
}
}

Answer 4

var label = $('label', '.dataTables_filter');
    label.html(label.children());

FIDDLE

children()将不包含文本节点，因此只需使用元素重写内容，并删除文本节点。