JavaScript只用一個類檢索div元素的唯一'id'？

Question

當使JavaScript腳本遍歷一組具有相同類名稱的元素時，可以單獨更改它們的每個屬性。

如果腳本沒有唯一ID，腳本如何知道要編輯哪個元素？如果他們確實擁有唯一的ID，那麼你如何找回他們？使用alert();來顯示簡單的document.getElementsByClassName('');節點數組中保存的內容似乎顯示了元素的類型。

我真的可以將這些結果存儲在數組中供以後使用嗎？

如果在文件上負載，我取元件的具有特定的類名稱的數組：

<script> 

var buttonArray = document.getElementsByClassName('button'); 

</script> 

然後通過這個迭代，並且在「R」位置，以將對象添加結果：

<script> 

var buttonArray = document.getElementsByClassName('button'); 
var buttonObject = {}; 

for(r=0;r<buttonArray.length;r+=1) 
{ 
    buttonObject[buttonArray[r]] = [r*5,r*5,r*5]; 
} 

</script> 

我將能夠找到陣列與類名的「按鈕」每個單獨的元素，像這樣：

<script> 

var buttonArray = document.getElementsByClassName('button'); 
var buttonObject = {}; 

function changeCol(buttonID) 
{ 
    var red = buttonObject[buttonID][0]; 
    var green = buttonObject[buttonID][1]; 
    var green = buttonObject[buttonID][2]; 
    buttonID.style.backgroundColor = "rgb("+red+","+green+","+blue+")"; 
} 

for(r=0;r<buttonArray.length;r+=1) 
{ 
    buttonObject[buttonArray[r]] = [r*5,r*5,r*5]; 
    buttonArray[r].onclick = function(){ changeCol(this); }; 
} 

</script> 

我以爲onclick = function(){ changeCol(this); };的this部分會保存與我存儲在buttonObject對象中相同的唯一ID，作爲保存該數組的變量名？

應該這樣工作嗎？我似乎無法在我的網頁上找到它，所以我使用buttonObject中的按鈕innerHTML作爲保存該對象數組的變量名稱。問題在於，我可能需要兩個或多個按鈕才能擁有相同的innerHTML。

這裏的網頁，因爲它是目前： http://www.shadespeed.com

我需要重新做腳本，使按鈕具有相同的名稱。

任何提示/建議將不勝感激。

非常感謝！

- Dan。 :)

Answer 1

比方說，我有一副牌張開在我的桌子上，正面朝上。我想翻轉所有紅色的。我可能會這樣做：

desk.getCardsByColour("red").forEach(flipit); 
// note, obviously not real JavaScript for a not real situation :p 

所以我掃描我的卡片，找到所有紅色的。然後我把它們翻過來。你要問的基本上是「如果沒有唯一的ID，我怎麼知道哪些牌可以翻轉？」那麼，我需要一個ID來迭代對象的集合，在這種情況下，一組卡？當然不是。

（注意，儘管在甲板卡做有其內容的唯一屬性，讓我們姑且認爲是元素的內容，而不是id屬性，凱？）

現在，這裏就是我想做你在做什麼：

for(r=0; r<buttonArray.length; r++) { 
    buttonArray[r].buttonObject = [r*5,r*5,r*5]; 
    buttonArray[r].onclick = changeCol; 
} 
function changeCol(button) { 
    var red = button.buttonObject[0]; 
    var green = button.buttonObject[1]; 
    var blue = button.buttonObject[2]; 
    button.style.backgroundColor = "rgb("+red+","+green+","+blue+")"; 
}