자바 스크립트 루프를 사용하여 반복 할 때 각 HTML 요소에 대해 함수를 호출 할 수있는 방법이 있습니까?

Robman

자바 스크립트 루프를 사용하여 반복되는 HTML 요소가 있습니다.

HTML은 다음과 같습니다.

<div class="description">Item 1</div>
<div class="description">Item 2</div>
<div class="description">Item 2</div>

자바 스크립트

let allItems =  document.querySelectorAll(".description")
  for (let i = 0; i <= allItems.length; i++) {
      allItems[i].addEventListener("click", toggleSpinner.bind(this));
     }
toggleSpinner = () => {
        alert("I clicked") // here should be, for example, "I clicked Item 1,
                           // Or Item 2 or Item 3 depending on which was clicked
      },

각 요소를 클릭 할 때 함수를 독립적으로 호출하는 방법

안녕하세요 세계

이런 식으로 사용할 수 있습니까?

toggleSpinner = (data) => {
  console.log(`You clicked item ${data}`) // here should be, for example, "I clicked Item 1,
  // Or Item 2 or Item 3 depending on which was clicked
}


let allItems =  document.querySelectorAll(".description")
for (let i = 0; i < allItems.length; i++) {
	allItems[i].addEventListener("click", toggleSpinner.bind(this, allItems[i].dataset.item));
}
<div class="description" data-item="1">Item 1</div>
<div class="description" data-item="2">Item 2</div>
<div class="description" data-item="3">Item 3</div>

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

Related 관련 기사

뜨겁다태그

보관