使用javascript在html中更改標籤foreach元素

Question

我使用的是html和速度，並提出了此代碼。名稱和圖像存儲在一個數組中，這是我用來顯示此數組的每個內容到頁面的代碼。

#foreach($starter in $starter) 
    <div class="product"> 
     <div class="color"><img src= "$starter.img" width="100" height="100"></div> 
     <span class="product-name">$starter.name</span> 
     <div class="compare-wrap"> 
     <input type="checkbox" id=""> 
     <label id="view">Compare</label> 
     </div> 
    </div> 
    #end 

我想要的標籤，從「比較」，以「觀比較」，而在同一時間在檢查他們的correspondng複選框其存儲陣列中的ID更改。我終於想出了這樣的代碼：

var checkedArray = []; 

$(":checkbox").change(function(){ 
    if((this).checked){ 
    checkedArray.push(this.id); 
    document.getElementById('view').innerHTML = "<a href='/compare'>View Compare</a>"; 
    } 
    else{ 
    checkedArray.splice(checkedArray.indexOf(this.id), 1); 
    document.getElementById('view').innerHTML = 'Compare'; 
    } 
var str = checkedArray.join(', '); 
alert(str); 
}); 

但它似乎只適用於數組的第一個內容。任何想法如何在這一點上使用一個foreach代碼？

Answer 1

document.getElementById()一次只支持一個名稱，只返回一個節點而不是一個節點數組。您應該使用一個類：

var views = document.getElementsByClassName('view'); 

var i = views.length; 

while(i--) { 

     views[i].innerHTML = "Compare"; 
} 

HTML

<label class="view">Compare</label> 

元素ID必須是唯一的。

希望它有幫助。