-
카테고리
-
세부 분야
웹 개발
-
해결 여부
미해결
질문있습니다!
21.10.17 19:10 작성 조회수 108
0
예제 처럼 .characters 에 setAttribute로 data-id 를 적용시켰듯이 만약 탭을 위한 버튼을 만든다고 가정 했을때
<div class="ilbuniBtn">
<ul class="ilbuniBox">
<li class="ilbuni a">
<p>일분이01</p>
</li>
<li class="ilbuni b">
<p>일분이02</p>
</li>
<li class="ilbuni c">
<p>일분이03</p>
</li>
<li class="ilbuni d">
<p>일분이04</p>
</li>
</ul>
</div>
각각의 li의 클래스인 .ilbuni에 data-tab 이라는 명칭과 그 안에 데이터의 값을 증가시켜 넣고 싶은데 그럴 때는 어떻게 하면 되나요?!!
제가 생각했던 방법은 for문으로 돌려 클래스에 개수를 가져오고 그 가져온 개수에 데이터아이디와 값을 증가 시켜 넣으면 되지 않을까 생각했습니다.
const ilbutab = document.querySelectorAll('.ilbuni ');
for( i=0; i < ilbutabl.length; i++ ){
ilbutab.setAttribute("data-tab", btn[i]);
또는
ilbutab.setAttribute("data-tab", i);
}
했더니 에러가 떠서 궁금해서 질문드립니다..!!
답변을 작성해보세요.
0
1분코딩
지식공유자2021.11.01
for문 안에서
ilbutab[i].setAttribute("data-tab", i);
또는
ilbutab[i].dataset.tab = i;
이렇게 하시면 됩니다~
만드신 변수 ilbutab은 .ilbuni 클래스를 가진 요소들을 다 가지고 있으므로,
for문 안에서는 인덱스 [i]를 통해 접근하는 거지요~
답변 1