存儲HTML節點作爲數組鍵

Question

我要存儲的元素在我的數組和對象爲值的鍵，例如 -

var arr = []; 
arr[ document.getElementById('something') ] = { data: 'something' , fn : function(){ } }; 

但問題是：如果我將再增加元素的關鍵是：document.getElementById('otherthing')。 然後將嘗試獲得值：arr[ document.getElementById('something') ].data，我會得到值arr[ document.getElementById('otherthing') ]。
例如：

var arr = []; 
arr[ document.getElementById('something') ] = { data: 'something' , fn : function(){ } }; 
arr[ document.getElementById('otherthing') ] = { data: 'otherthing' , fn : function(){ alert('k'); } }; 
alert(arr[ document.getElementById('otherthing') ].data); // alerts "otherthing" 
alert(arr[ document.getElementById('something') ].data); // alerts "otherthing" but suppose to alert "something" 

我怎樣才能解決這個問題，我通過`噸ID存儲，因爲我要支持其他節點沒有-ID
謝謝，Yosy。

編輯：我的答案，如果你有更好的答案請寫吧:)（由casablanca`s啓發接聽）
數組ID：關鍵整數節點ID，值的節點它自
與數據陣列，並與我的身份證的FN鍵，它會看起來像這樣：

var idArray = [],nodeArray = []; 

idArray[0] = document.getElementById('hello_ducks'); 
nodeArray[0] = { data: 'hello ducks!!' , fn : function(){ alert('k'); } }; 

idArray[1] = document.getElementById('hello'); 
nodeArray[1] = { data: 'hello' , fn : function(){ } }; 

var testNode = document.getElementById('hello_ducks'), foundId = -1 /*found id*/; 
// Do we have testNode in our array? 
for(var i = 0 ; i < idArray.length; i++){ 
    if(idArray[i] === testNode){ 
    foundId = i; 
    } 
} 

// Do we found our element? 
if(foundId >= 0) { 
    alert(nodeArray[foundId].data); // "hello ducks!!" 
} 

Answer 1

我不能老是用ID保存，因爲我要支持其他節點沒有-ID

你應該記住爲了從數組中取回節點，你必須以某種方式識別它。如果一個節點沒有任何這樣的唯一標識符，那麼以後如何從數組中檢索它，甚至將它存儲在第一位？

在像C++這樣的低級語言中，每個對象都隱式地擁有一個唯一的地址，但是在JavaScript中沒有這樣的東西，所以您需要手動提供某種標識對象的方法，並且DOM ID是這是做這件事最方便的方法。

如果您的一些節點最初沒有ID，最好的處理方法是簡單地分配您自己的唯一ID。

---

更新：您發佈的工作，但因爲你需要每一個你需要找一個節點時，搜索整個陣列它不是非常有效的解決方案。爲什麼不簡單地將自己的ID分配給那些沒有的ID？例如：

var nextID = 0; 
function getID(elem) { 
    if (elem.hasAttribute('id') == false || elem.id == '') 
    elem.id = 'dummy-' + (++nodeID); 
    return elem.id; 
} 

這樣，您就可以隨時使用的ID作爲關鍵字：

var nodeArray = []; 

var e = document.getElementById('hello'); 
nodeArray[getID(e)] = { ... }; 

var e = /* element obtained from somewhere, doesn't have an ID */ 
nodeArray[getID(e)] = { ... }; // still works 

Answer 2

我建議，而不是使用數組爲了這個目的，你把DOM-的優勢元素是物體：

document.getElementById('something').info = {data: 'something', fn: function() { } }; 

但是，您可能最終會遇到某些舊瀏覽器中的內存泄漏問題（請參閱：ie6）。如果你使用jQuery的數據存儲，而不是被固定：

$("#something").data("info", {data: 'something', fn: function() { } });