のdivの 1がこれを好きなはずです、私はdiv要素のリストを作成したいと考えて動的要素

Question

を作成するためのonclickイベントを追加私の機能。 setAttributeを使用していた働いたソリューションのひとつ：

for(var i = 0; i < array.length; i++){ 
    var div = document.createElement("div"); 
    div.setAttribute("onclick", 'myFunc(this, \''+array[i]+'\')'); 
    myDiv.appendChild(div); 
    } 

唯一の問題は、この部分が本当に醜いということである。これを達成するための他の方法は をあり\''+array[i]+'\')'？ところで

div.setAttribute("onclick", myFunc(this, array[i]); 

---

：それはこのまたは類似のもののようになります。他の解決策：div.onclickを使用したときにonclick attrがdiv（結果：<div></div>）に表示されない可能性があります。

Answer 1

var array = ['bla1','bla2']; 
 

 
var myFunc = function(value) { 
 
    alert('click : '+ value); 
 
}; 
 

 
var myDiv = document.getElementById('myDiv'); 
 

 
for(var i = 0; i < array.length; i++){ 
 
    var div = document.createElement("div"); 
 
    div.className = 'bla'; 
 
    myDiv.appendChild(div); 
 
    
 
    div.addEventListener('click', myFunc.bind(this, array[i])); 
 
}

.bla { 
 
    border: 1px solid black; 
 
    width: 20px; 
 
    height: 20px; 
 
    margin: 10px; 
 
    }

<div id="myDiv"></div>

したいということですか？