배열에 대한 Javascript for-of 루프 및 for-of 루프에 대한 값을 ul에 전달합니다.

Question

양식에있는 페이지에 표시되는 항목이 ul 있습니다.

양식 제출시 각 li에 링크를 추가하고 싶습니다. 나는 반복을 통해 배열과 루프를 통해 메소드 루프를 가지기를 원하는 링크 배열을 가지고있다. 본질적으로 각 li에 setAttribute를 반복적으로 사용한다.

다음 내 코드 임 (자사의 워드 프레스 사이트 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; 
     } 
    } 
})() 

지금까지 난 단지 수 첫 번째 링크를 넘기고, 배열을 반복하지는 않지만, 저는 리를 반복합니다.

Answer 1

아마도 더 많은 문제를 설명하는 것이 좋습니다. 그러나, 내 listItems 항상 내부 링크에서 3 번 링크를 변경하고 마지막 하나 'link3'에서 중지하기 때문에 href 'link3'가 나타납니다. 당신이 그런 식으로 중첩 루프를 사용하면 모든 link에, 당신은 hreflistItem 모든의를 설정하는

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

을 수행 할 whay

은 어쩌면이다. 각 listItem의 href을 해당 link으로 설정하려면 두 컬렉션에 대해 동일한 색인을 사용하는 단일 루프 만 있으면됩니다.

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