如何使用沒有名稱或ID的JavaScript替換標籤中的文本？

我使用的數據表jQuery插件美化我的表。我試圖風格化的搜索框看起來更像這個如何使用沒有名稱或ID的JavaScript替換標籤中的文本？

CSS3 search box

但是生成的JavaScript代碼在數據表當前搜索框中看起來像這樣

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

我能夠獲得javascript來爲搜索框添加一個佔位符屬性。但我不知道如何刪除搜索：文本。我在google上看到了一些解決方案，但他們要求標籤有一個我沒有的id。

來源

2012-07-20 devcoder

可以刪除使用含有Search:文本節點：

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

.first()是因爲它是在標籤的第一個節點（文本節點）。諸如.contents()和.first()之類的函數使您能夠在不需要ID的情況下查找節點（遍歷DOM）。本質上，你從一個元素開始，通過具體的函數在DOM中走，直到你達到了所需的元素。

來源

2012-07-20 22:27:46 pimvdb

刪除我不完整的答案，因爲完成它本質上會複製自己的答案。 +1！ – 2012-07-20 22:29:54

太棒了！謝謝！ – devcoder 2012-07-20 22:32:23

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 
} 
}

來源

2012-07-20 22:30:55 Sid

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

FIDDLE

children()將不包括文本節點，所以才改寫，只有元素的內容，並且擺脫了文本節點。

來源

2012-07-20 22:33:31 adeneo

我仍在學習JavaScript。 $（'label'，'.dataTables_filter'）;工作？ – devcoder 2012-07-20 22:38:49

它使用上下文，基本上它只是'$（'.dataTables_filter'）。find（'label'）'的一個快捷方式，它可以找到任何帶有類dataTables_filter的元素的標籤元素。你可以使用任何你喜歡的選擇器，'$（'＃countstable_filter label'）'更簡單，更好的IMO，我只是不想複製代碼，所以想出了其他的東西。選擇器不是真的答案，方法是，我認爲這比'contents（）。first（）'更簡單。 – adeneo 2012-07-20 22:42:38

我不能說是否更簡單。我是JS的新手，另一種方式看起來更簡單一些，也許是因爲我習慣用Nokogiri來挖掘DOM，並且通常使用該方法。 – devcoder 2012-07-20 22:54:03

由於您使用的數據表，你也可以通過改變語言變量sSearch看到oLanguage.sSearch和jsBin更多的文檔關閉Search:字符串。

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

來源

2012-12-12 22:54:03

如何使用沒有名稱或ID的JavaScript替換標籤中的文本？

回答

相關問題