document.getElementsByTagName（「img」）;與document.getElementById（'testimg'）;

Question

這裏是我的html

<a href="index.php"><img id="testimg" src="images/logo.png"/></a> 

這裏是我的javascript

function getW(){ 
    var theImg = document.getElementById('testimg'); 
    return theImg; 
} 

theImg = getW(); 

if (theImg.width > 119){ 
    document.write(theImg.width); 
} 

現在，當我使用這個腳本出來放IMG寬度

然而，當我使用這個腳本

function getW(){ 
    var theImg = document.getElementsByTagName("img"); 
    return theImg; 
} 

theImg = getW(); 

if (theImg.width > 119){ 
    document.write(theImg.width); 
} 

它不輸出任何東西。有什麼區別，爲什麼這第二個腳本工作？

謝謝！

Answer 1

因爲getElementsByTagName()返回一組多個元素（注意元素）。您需要使用[0]才能獲得第一個匹配。

另一方面，id應該始終是唯一的，因此getElementById()返回對單個元素的引用。

Answer 2

gEBTN返回一個節點列表。爲第一個元素做theImg[0]。

對於您的其他問題，請在nodeList的length上執行for循環。

Answer 3

getElementsByTagName（）返回與您提供的標記名稱相匹配的節點（元素）數組。所以，當你的第一個代碼示例返回一個元素時，你的第二個代碼將使用一個數組。

爲了得到你所通過的getElementsByTagName尋找的形象，你要麼需要需要做的屬性的搜索（找到一個合適的名稱或ID標籤，例如）或簡單地知道它在頁面上的順序。

在您的示例中，Img [0]將返回您正在查找的圖像。

Answer 4

方法document.getElementById('testimg')返回一個真實的元素對象，其ID爲testimg。方法document.getElementsByTagName("img")將返回一個包含標籤爲img的所有元素對象的數組。

但是，如果有多個元素的ID爲testimg，則方法document.getElementById('testimg')將返回第一個元素。

Answer 5

替換您的代碼：

var theImg = document.getElementsByTagName("img"); 

與此代碼：

var theImg = document.getElementsByTagName("img").item(0); 

或與此代碼：

var theImg = document.getElementsByTagName("img")[0]; 

兩者是等價的，要注意.item(0)，它相當於[0]。

如果所需的圖像是第一個，則零是正確的，否則將零替換爲正確的索引。