如何將JavaScript中的對象關聯或關聯到HTML元素？

如何將JavaScript中的對象與HTML元素相關聯或關聯？如何將JavaScript中的對象關聯或關聯到HTML元素？

對於數組中的每個對象，我生成一個基於該對象的複選框輸入元素。

如果我添加一個事件偵聽器來捕獲複選框更改，如何檢索與該元素關聯的對象？

來源

2011-09-10 XP1

相關：[？自定義屬性 - 是還是不是（http://stackoverflow.com/questions/992115/） –

您可以爲每個複選框生成一個ID，並將該ID存儲在相應的對象中。然後，在事件處理程序中，您可以獲取已更改複選框的ID，並通過迭代數組來找到適當的對象。

爲了更容易找到對象，還可以將ID映射到對象（例如objectsByID[someID] = someObject）。採用這種方法，您甚至不必遍歷數組。

的如何創建objectsByID地圖示例：

var objectsByID = {}; 

for (var i = 0; i < objects.length; i++) { 
    var id = "checkbox_" + i; 

    var checkbox = document.createElement("input"); 
    checkbox.setAttribute("type", "checkbox"); 
    checkbox.setAttribute("id", id); 
    // ... 

    objectsByID[id] = objects[i]; 
}

來源

2011-09-10 15:46:48

您爲每個複選框提供一個漸進ID，從「checkbox0」開始，當您單擊複選框時，將檢查與數組[x]中的對象相對應的相對ID號。

這是一個非常簡單的example。

來源

2011-09-10 15:42:52

作爲其他的答案指出，產生一個唯一的id對每個DOM節點，可以使用那些作爲鍵中的對象。

另一種可能性是許多框架提供了將數據分配給DOM元素的工具。例如，在jQuery中，你可以通過編寫$(checkbox).data('mydata', obj)或YUI Y.one(checkbox).setData('mydata', obj)來完成。

來源

2011-09-10 15:55:13 juandopazo

雖然你不需要任何框架值分配給DOM元素。簡單的'checkbox.mySrcObject = objects [i]'會做。 +1 –

創建全局對象，在創建複選框時存儲其他對象，並用唯一名稱標識。將該複選框元素的名稱或id屬性設置爲此唯一名稱。

var source = []; 
var data = []; //Your data 
var appendTo = document.body;//Anywhere 
for(var i=0; i<data.length;i++){ 
    var identifier = "chk"+i; 
    var inp = document.createElement("input"); 
    inp.type = "checkbox"; 
    inp.name = identifier;//.name or .id - it's up to your preference 
    inp.addEventListener("change", function(ev){ 
    if(this.checked){ 
     callback(source[this.name]);//calls function callback, passing the original object as an argument. 
    } 
    }, true); 
    appendTo.appendChild(inp); 
    source[identifier] = ...//your object. 
}

來源

2011-09-10 16:05:32

如何將JavaScript中的對象關聯或關聯到HTML元素？

回答

相關問題