前提・実現したいこと
自サイトの画像をふわっと表示できるようにしたいのですが(https://do.gt-gt.org/TEMP/gt001/1column.html のillustのところのようなイメージ)、
「body.insertBefore(newElement, body.firstChild);」のところでエラーが出てうまく表示できません。
46行目なのでかなり前で躓いているようですがどう直せばいいかわからないです。
他の行でも、なぜかinsertBeforeを読み込んでくれません。
どなたかわかりやすく説明と直し方をお願いいたします。
発生している問題・エラーメッセージ
Uncaught TypeError: Cannot read property 'insertBefore' of null at fuwaimg.js:46
該当のソースコード
JavaScript
1 // 要素の描写 2 3 // ----------------------------------------------------- 4 5 const body = document.querySelector('body'); 6 7 var newElement = document.createElement('div'); 8 newElement.setAttribute('id','fuwaimg'); 9 newElement.setAttribute('class','hidden'); 10 body.insertBefore(newElement, body.firstChild); 11 var parent = document.getElementById('fuwaimg');
HTML
1<!DOCTYPE html> 2<html lang="ja"> 3 4<head> 5 <meta charset="utf-8"> 6 <title>illusts</title> 7 <meta name="viewport" content="width=device-width, initial-scale=1"> 8 9 <script src="../js/fuwaimg.js"></script> 10</head> 11 12 <body> 13 14 <ul> 15 <li><a href="illust.png" class="fuwaimg"><img src="illust_s.png"></a></li> 16 </ul> 17 18 </body> 19 20</html>
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。