BinaryDevelop
  1. ホーム
  2. JavaScript

JSクリックイベント - Uncaught TypeError: プロパティ 'onclick' に null を設定できません。

2022-02-10 06:14:46

html コードです。 

<body>
    <button id="button">Click me</button>
    <img id="image" src="cat.png" width="100px">
</body>

JSコードです。 

<script>
    var button = document.getElementById("button"),
        image = document.getElementById("image");

    button.onclick = function () {
        image.style.display = "none";
    };
</script>

実現したい効果：ボタンがクリックされると、画像が消える。

私がやったこと jsのコードを<head>に入れたところ、Uncaught TypeErrorというエラーが発生しました。プロパティ'onclick'をnullに設定できません。

改善されました。JSコードを</body>の最後の前に置くと、完全に動作するようになりました。

Q：なぜこのようなことが起こるのでしょうか？JSコードの実行順序と関係があるのでしょうか。

回答 いくつかの情報を確認したところ、<head>に配置されたJSコードは、ページよりも先に実行されることがわかりました。

出典 クリックするとリンクが開きます

別の方法として、元のJSコードを <スパン window.οnlοad=function() { ... } この場合、window.onloadはページが読み込まれた後に実行される関数を示しているので、JSコードが <head> に配置されても完全に動作します。

関連

最新

おすすめ

について
/
プライバシー・ポリシー
/
お問い合わせ
© 2022 BinaryDevelop. すべての権利は、それぞれの所有者に帰属します