配列のJavascript for-ofループとulのfor-ofループに値を渡す

Question

フォームの下にページに表示されている項目がulです。

フォームの提出時に各liにリンクを追加します。私は配列とループの上にメソッドのループを持っていたいと思うリンクの配列を持っています。本質的に各liにsetAttributeを繰り返します。

次の私のコードイム（そのwordpressのサイトBC）アクションフックを使用して提出を監視していると協力し、アクションフックのコールバック関数で返す：

(function(){ 
var links = ['link1', 'link2', 'link3']; 
var parentList = document.querySelector('.support-list'); 
var listItems = parentList.querySelectorAll('a'); 

for(var listItem of listItems){ 
    for(var link of links){ 
     listItem.href = link; 
     } 
    } 
})() 

は、これまでのところ、私はできるだけで最初のリンクを渡します。Imは配列を反復しませんが、私はliを繰り返し処理しています。

Answer 1

多分あなたの問題をもっと説明する方がいいでしょう。しかし、私はあなたのlistItemsは常に内側のループで3回リンクを変更し、最後の 'link3'で停止するので、href 'link3'を持っていることがわかります。

あなたはあなたがそのようなネストされたループを使用する場合

listItems.forEach(function(item,index){ 
item.href = links[index % 3]; 
//modulus is used in case you have more than three items, otherwise it is not really needed but wont cause any trouble. 
}) 

Answer 2

、あなたはすべてのlinkにすべてのlistItemのhrefを設定しているをしたいwhay多分これです。各listItemのhrefを対応するlinkに設定する場合は、両方のコレクションで同じインデックスを使用する単一のループを作成するだけです。

for (var i = 0; i < listItems.length; i++) { 
    listItems[i].href = links[i]; 
}