代码之家 › 专栏 › 技术社区 › Yosi

将html节点存储为数组中的键

dom javascript

Yosi · 技术社区 · 14 年前

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的节点
谢谢,尤西。

id的数组:key integer节点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!!"
}

2 回复 | 直到 14 年前

casablanca 14 年前

我无法按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

Magnar 14 年前

我建议不要为此目的使用数组,而是利用DOM元素作为对象:

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

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