如何使用javascript更改html頁面的「h1」標籤的內容？

Question

當我使用javascript加載頁面時，我需要更改HTML文件中所有「h1」標籤的內容。

所以我寫了下面的代碼

window.onload = function() { 
    var h1html = document.createElement("h1"); 
    var h1htmltext = document.createTextNode("header 1"); 

    h1html.appendChild(h1htmltext); 

    document.getElementsByTagName("h1").appendChild(h1html); 
}; 

Answer 1

使用此：

for(var i = 0, elems = document.getElementsByTagName('h1'); i < elems.length; i++) { 
    elems[i].innerHTML = "new"; 
} 

fiddle

Answer 2

如果你確定你只有一個h1標籤，你可以簡單地做

window.onload = function() { 
    document.getElementsByTagName("h1")[0].innerHTML = "header 1"; 
} 

如果多個h1標籤都存在，你可以做

window.onload = function() { 
    var h1Elems = document.getElementsByTagName("h1"); 
    var pos; 
    for (pos in h1Elems) { 
     h1Elems[pos].innerHTML = "header 1"; 
    } 
} 

Answer 3

您需要更改每個元素的innerHTML，如su CH

function changeall(){ 
    var headers=document.getElementsByTagName("h1"); 
    var newheadertext="hello"; 
    for(var i in headers){ 
     headers[i].innerHTML=newheadertext; 
    } 
} 

Answer 4

getElementsByTagName返回一個節點列表;你需要循環它。

var headers = document.getElementsByTagName("h1"); 

for(var i = 0; i < headers.length; i++) { 
    var header = headers[i]; 
    var text = document.createTextNode("header 1"); 

    while(header.childNodes.length) { 
     header.removeChild(header.firstChild); 
    } 

    header.appendChild(text); 
} 

我做了一些假設有：

• 你不會真的想窩頭
• 要替換的內容
• 你想要一箇舊標準兼容的方式

如果你不需要老瀏覽器的支持，只需使用textContent：

var headers = document.getElementsByTagName("h1"); 

for(var i = 0; i < headers.length; i++) { 
    headers[i].textContent = "header 1"; 
}