如何使用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

如果您確定只有一個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 2

用這個：

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

小提琴

Answer 3

您需要更改每個元素的innerHTML，因為這樣

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