web-dev-qa-db-ja.com

Uncaught Typeerror：nullのプロパティ 'innerHTML'を読み取れません

誰もがこれらのエラーとは何かを説明できますか？

Uncaught TypeError：nullのプロパティ 'innerHTML'を読み取れません

私の表示 website これはエラーを引き起こしている行です：

var idPost=document.getElementById("status").innerHTML;

ありがとう

javascriptpropertiesinnerhtmltypeerror
7
Davix Ponze

更新：

質問はjqueryを求めていません。だからjqueryなしでそれをしましょう：

document.addEventListener("DOMContentLoaded", function(event) { 
    //Do work
});

この方法はIE8では機能しないことに注意してください。

古い答え：

DOMの準備が整う前にこのスクリプトを呼び出しています。このコードをjqueryの$（function（）メソッドに書き込むと機能します。

22
egiray
var idPost=document.getElementById("status").innerHTML;

'status'要素がWebページに存在しません。

したがって、document.getElementById（ "status"）はnullを返します。ただし、NULLのinnerHTMLプロパティは使用できません。

次のような条件を追加する必要があります。

if(document.getElementById("status") != null){
    var idPost=document.getElementById("status").innerHTML;
}

この回答がお役に立てば幸いです。 :)

22
jianbo.zheng

エラーの原因となっているコードをハイライトして質問内に投稿するのが理想的ですが、エラーは 'status'要素の内部HTMLを取得しようとしているためです。

var idPost=document.getElementById("status").innerHTML;

ただし、 'status'要素存在しない HTML内-必要な要素を追加するか、検索しようとしているIDを有効な要素を指すように変更します。

4
James Shuttler

bodyステートメントのhtml構造の後にコードを実行します

    <html>
    <body>
    <p>asdasd</p>
    <p>asdasd</p>
    <p>asdasd</p>
    <script src="myfile.js"></script>
    </body>
    </html>
4
agalal designs

同様の問題がありましたが、既存のIDがあり、egirayが言ったように、ロードする前にDOMを呼び出していて、JavaScriptコンソールに同じエラーが表示されていたので、次のことを試しました。

window.onload = (function(){myfuncname()});

そしてそれは働き始める

4
Kel_Ebek

スクリプトがHTMLドキュメントの先頭にある場合、最終的に何が表示されるかに関係なく、HTMLドキュメントの本文はまだブラウザーによって作成されていません（スクリプトがHTMLファイル内にあるが、素子）。変数がdocument.getElementById（ "status"）を見つけようとしたときにまだ存在していないため、nullの値を返します。その後、コードで変数を使用すると、変数が更新されていないため、現在の値ではなく初期値（null）が使用されます。

スクリプトリンクをHTMLヘッドの外に移動したくなかったので、代わりにJSファイルで次のようにしました。

var idPost //define a global variable
function updateVariables(){
    idPost = document.getElementById("status").innerHTML; //update the global variable
}

そして、これはHTMLファイルで：

<body onload="updateVariables()">

すでにonload関数がある場合は、それに追加の行を追加するか、関数を呼び出すだけです。

変数をグローバルにしたくない場合は、実行しようとしている関数でローカルに定義し、ページが完全に読み込まれる前に関数が呼び出されないようにしてください。

3
Catherine Gracey
//Run with this HTML structure
<!DOCTYPE html>
<head>
    <title>OOJS</title>

</head>
<body>
    <div id="status">
    </div>
    <script type="text/javascript" src="scriptfile.js"></script>
</body>
</html>
0
Swaraj ghosh