実現したいこと
ボタンをクリックして該当部分のdata属性を書き換えています。
「たちつてと」部分のdata属性を書き換えるため
JSで「たちつてと」のaタグを取得したいです。
※この場合、IDを振るなどせず、現状のHTMLには修正を加えないものとします。
「あいうえお」のaタグを取得し、変数list_aiueoに代入した場合
list_aiueoから「たちつてと」のaタグを取得するには
どのようにすればよいのでしょうか。
( list_aiueo.children.childrenでしょうか?)
querySelectorAll内を .wrappInner>ul>li>ul>li>a として「たちつてと」のaタグを指定するのは
スマートではないように思っています。
ご教授いただけないでしょうか。
該当のソースコード
HTML
1<div class="wrappInner"> 2 <ul> 3 <li><a href="#" data-num="01">あいうえお</a></li> 4 <li> 5 <ul> 6 <li><a href="" data-num="04">たちつてと</a></li> 7 </ul> 8 </li> 9 </ul> 10</div> 11<div class="wrappInner"> 12 <ul> 13 <li><a href="#" data-num="02">かきくけこ</a></li> 14 </ul> 15</div> 16<div class="wrappInner"> 17 <ul> 18 <li><a href="#" data-num="03">さしすせそ</a></li> 19 </ul> 20</div> 21 22<button type="button">ボタン</button> 23
Javascript
1//ボタン要素 2const btn = document.querySelector("button"); 3 4//クリック後の動作 5btn.addEventListener("click", function(){ 6 addDatasetAction(); 7 8 function addDatasetAction() { 9 const lists = document.querySelectorAll('.wrappInner>ul>li>a'); 10 for(let list of lists){ 11 list.dataset.num = "1000"; 12 console.log(list); 13 } 14} 15});

回答3件
あなたの回答
tips
プレビュー
下記のような回答は推奨されていません。
このような回答には修正を依頼しましょう。
また依頼した内容が修正された場合は、修正依頼を取り消すようにしましょう。
2022/11/22 00:37