的HTMLCollection和節點列表

你好，我有哪裏我試圖通過他們搶，所以我可以循環的所有圖像，並添加下面的事件處理程序的一個問題：的HTMLCollection和節點列表

addEventListener('dragstart', handleDragStart, false); 
    addEventListener('dragenter', handleDragEnter, false); 
    addEventListener('dragover', handleDragOver, false); 
    addEventListener('dragleave', handleDragLeave, false);

我有點疑惑，因爲我已經試過的getElementById到通過AJAX獲取所有圖像動態填充的區域區域。現在在查詢選擇器Al l（）似乎沒有抓住任何東西。我假設我只是使用這個錯誤。也許它不響應標籤。但我試着用getElementsByTagName，它似乎抓住一切，並把它放到HTMLCollection中。然而，HTML集合的長度是0.是否有一個使用Javascript（而不是jQuery）來獲得這些事件處理程序附加到每個IMG的最佳實踐方式？我在這裏迷失瞭如何抓住然後操縱它們。 .length似乎不工作，我不習慣HTMLCollection，它似乎是我所得到的。

var imagesContainer = document.getElementById("images"); 

var allImages = document.querySelectorAll('#images img'); 
console.log(allImages); 
console.log(allImages.length); 

var allImages2 = imagesContainer.getElementsByTagName("img"); 
console.log(allImages2); 
console.log(allImages2.length);

來源

2013-01-18 kmalik

你確定當你試圖找到它們時圖像已經在DOM中了嗎？ – bfavaretto

有沒有辦法檢查？根據我的理解，他們是因爲HTMLCollection會選取它們，並在兩幅圖像中顯示兩幅圖像（儘管可能更多）。 – kmalik

我不贊成，你是正確的bfavaretto。在所有事情都確實受到歡迎之後，我將代碼放在了回調函數中，而且現在似乎可以工作。我想我必須確保在該函數中附加事件監聽器。我沒有意識到它可以得到圖像的名稱，並沒有得到DOM似乎工作的方式。 – kmalik

我確定bfavaretto是正確的。爲了檢查dom是否正在加載，我將add事件處理程序移到了ajax調用完成後加載圖像的位置（在if語句中檢查readyState和readyStatus）。我之前沒有想到這一點，因爲我個人誤解了DOM如何加載它的HTMLCollection和數組長度，並認爲一旦加載了所有東西，它就會加載。雖然它正確地抓取了所有圖像，但DOM沒有被加載來抓取，並且從我的理解中充分構建了長度。

來源

2013-01-19 14:35:31 kmalik

的HTMLCollection和節點列表

回答

相關問題