前提・実現したいこと
queryselectorallで複数要素を取得し、「スクロールするたびに○○する」というプログラムを書きたいのですが、取得したnodelistが0になってしまいます。
調べてもわからなかった為質問させて頂きます。
該当のソースコード
html
1<ul class="contents-item"> 2 <li class="targetElement"> 3 <img src="img/chihiro6.png" alt="温泉"> 4 <div class="redLine"></div> 5 <div class="item-text"> 6 <h2>タイトル</h2> 7 <p>てきすとてきすとてきすとてきすとてきすとてきすと</p> 8 </div> 9 <div class="btn"><a href="#">詳細はこちら</a></div> 10 </li> 11 12 <li class="targetElement"> 13 <img src="img/chihiro3.jpg" alt="食事"> 14 <div class="redLine"></div> 15 <div class="item-text"> 16 <h2>タイトル</h2> 17 <p>てきすとてきすとてきすとてきすとてきすとてきすと</p> 18 </div> 19 <div class="btn"><a href="#">詳細はこちら</a></div> 20 </li>
javascript
1const targetElement = document.querySelectorAll(".targetElement"); 2 3console.log(targetElement); 4
console
1NodeList(0) 2length: 0 3__proto__: NodeListentries: 4 ƒ entries()forEach: ƒ forEach()item: ƒ item()keys: ƒ keys()length: (...)values: ƒ values()constructor: ƒ NodeList()Symbol(Symbol.iterator): ƒ values()Symbol(Symbol.toStringTag): "NodeList"get length: ƒ length()__proto__: Object 5
HTML半端ですが、それでは他者が再現できません。
あと、そのscriptはどこに書いているのでしょう。