前提・実現したいこと
ジャバスプリクト初学者です。
サイト、https://qiita.com/tonnkatubooy/items/4e6184df19a6411e2ebbを参考に、ジャバスプリクトを使ってのサムネイル画像の差し替えをしたいのですが、初めの
~cssセレクタの '.thumb'を取得して定数thumbsに代入~からうまくいかず、困っています。
発生している問題・エラーメッセージ
Failed to load resource: the server responded with a status of 404 (not found)
画像が見つからない様です。
該当のソースコード
html
1 ```<div id="gallery"> 2 <div class="center"> 3 <div> 4 <img src="imagessa/sa1.jpg" alt="テキスト" id="bigimg"> 5 <p>テキスト</p> 6 </div> 7 <ul> 8 <li><img src="thumb-imagessa/sa1.jpg" alt="テキスト" class="thumb" data-image="imagessa/sa1.jpg"></li> 9 <li><img src="thumb-imagessa/sa2.jpg" alt="テキスト" class="thumb" data-image="imagessa/sa2.jpg"></li> 10 <li><img src="thumb-imagessa/sa3.jpg" alt="テキスト" class="thumb" data-image="imagessa/sa3.jpg"></li> 11 <li><img src="thumb-imagessa/sa4.jpg" alt="テキスト" class="thumb" data-image="imagessa/sa4.jpg"></li> 12 <li><img src="thumb-imagessa/sa5.jpg" alt="テキスト" class="thumb" data-image="imagessa/sa5.jpg"></li> 13 <li><img src="thumb-imagessa/sa6.jpg" alt="テキスト" class="thumb" data-image="imagessa/sa6.jpg"></li> 14 <li><img src="thumb-imagessa/sa7.jpg" alt="テキスト" class="thumb" data-image="imagessa/sa7.jpg"></li> 15 <li><img src="thumb-imagessa/sa8.jpg" alt="テキスト" class="thumb" data-image="imagessa/sa8.jpg"></li> 16 </ul> 17 </div> 18 </div> 19 <script src="app.js"></script> 20 </div> 21コード
js
1```const thumbs = document.querySelectorAll(".thumb");//cssセレクタの '.thumb'を取得して定数thumbsに代入 2 console.log("thumbs");//一旦コンソールで値が格納されているか確認しておきます 3コード
試したこと
まだjsの文法も覚束ないのでテキストでおかしいところがないか確認。
多分、スペルミスとか記号やスペースの間違いが原因ではないかなと思いcyo見直しましたが自分では気づけなかったのでこちらで質問させていただいています。
補足情報(FW/ツールのバージョンなど)
該当サイト(練習で作っているサイトです)↓
http://vera.html.xdomain.jp/sakuhinnsyuu.html
imagessaはsakuhinnsyuuの画像ファイルを入れているところです。
サイト、https://qiita.com/tonnkatubooy/items/4e6184df19a6411e2ebbのやり方を参考にしています。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2021/08/14 22:34