如何鏈接getElementById和getElementByClassName

我有一個ID爲「productPriceContainer」的div，並在此div內有一個類「price」。我想訪問class「price」的innerHTML，因爲我還有其他類叫做「price」。如何鏈接getElementById和getElementByClassName

我可以鏈接這樣的東西嗎？

document.getElementById(productPriceContainer).getElementsByClassName(price).innerHTML

如果不是什麼是正確的做我需要什麼？

感謝

來源

2013-01-21 user208709

沒有功能getElementByClassName。 –

@dystroy - [？]（http://caniuse.com/getelementsbyclassname） –

@Damien_The_Unbeliever注意** s **？這很重要。它解釋了爲什麼你不能像這樣連鎖。 –

如果您有與ID productPriceContainer元素price類一個元素，你可以做

document.getElementById('productPriceContainer') 
    .getElementsByClassName('price')[0].innerHTML

通知的小號在getElementsByClassName。它解釋了爲什麼你不能像這樣連鎖。您沒有稱爲getElementByClassName的函數，因爲與id相反，沒有給定類的元素的唯一性。

來源

2013-01-21 12:57:19

也有使用querySelector的選擇，它更簡潔得多。 – nhahtdh

@nhahtdh對。但[不兼容]（https://developer.mozilla.org/en-US/docs/DOM/Document.querySelector）。 –

由於某種原因，當我嘗試檢索innerHTML時，我的變量中出現「undefined」，這可能是什麼原因？ – user208709

差不多。

如果你想傳遞一個字符串，那麼你必須傳遞一個字符串，而不是不確定的變量
getElementsByClassName（複數！）返回一個節點列表，而不是一個節點，所以你必須遍歷它來獲得節點（您可以再使用innerHTML

來源

2013-01-21 12:57:40 Quentin

由於某種原因，當我嘗試檢索innerHTML時，我的變量中出現「undefined」，這可能是什麼原因？ – user208709

@ user208709 - 您仍在嘗試訪問NodeList的innerHTML，而不是循環訪問它，並訪問其中一個或多個元素的innerHTML。 – Quentin

所以你的意思是我必須分配[0]，如果我想訪問的NodeList的第一個孩子的innerHTML權利？ – user208709

你傳遞一個變量，而不是字符串的方法 - >應該是"price"不price
爲一個類名檢索節點的方法是getElementsByClassName你失蹤的「S」
它返回的DOM元素的數組，所以你必須遍歷你的容器的孩子的

例如：

document.getElementById("productPriceContainer").getElementsByClassName("price")[0].innerHTML = "Asdf";

設定第一的innerHTML與你的容器元素，以「ASDF」

遍歷元素中的類"price" DOM元素看起來是這樣的：

var elements = document.getElementById("productPriceContainer") 
if(elements) { 
    var classes = elements.getElementsByClassName("price"); 
    for (var i = 0; i < elements.length; i++) { 
    elements[i].innerHTML = "Asdf" + i; 
    } 
}

這裏是一個JSBin

來源

2013-01-21 13:00:48 C5H8NNaO4

但是，如果沒有元素與尋求的ID，這將拋出一個錯誤... –

這是正確的，但如果你遍歷的元素和節點列表的長度爲0它不會啓動循環。 - >我將用一個簡單的for循環添加一個示例 – C5H8NNaO4

如果沒有具有id爲'productPriceContainer'的元素，則不會糾正錯誤。這個問題的許多其他答案也有同樣的問題。你的是我看到的第一個。 –

如何鏈接getElementById和getElementByClassName

回答

相關問題