appendChildメソッドが動作しない

Question

実際、JSFiddleでは問題なく動作するようです。

https://jsfiddle.net/3zjqwbgy/5/

私はメモ帳++を使用してローカルで実行しようとすると、しかし、私は次のエラーを取得する：

Cannot read property 'appendChild' of null 

この理由何ができますか？どうすればローカルで動作させることができますか？

Answer 1

あなたがappendChildメソッドを実行すると、使用可能なHTMLを持っていることを確認してください。

を：JSFiddleは - あなたはしかし、それを変更することができます（デフォルトでは）自動的にあなたのためにそれをやっているので、それがJSFiddleで働いて

window.addEventListener("load", function() { 
    /* your actual code */ 
    ... 
    showElmntProperty("myDeck", "cardName", "first"); 
}); 

：あなたはloadハンドラにすべてを包むよ意味

Answer 2

コードがJSFiddle上で動作するので、私は私の頭の上から考えることができる唯一のことは、あなたがあなたの<script></script>タグを紛失しましたです。テーブルの下に移動して、JavaScriptによって「見える」ようにしてください。

Answer 3

「プロパティを読み取れません」というプロパティ名「null」を取得すると、そのメソッドを呼び出すオブジェクトが実際にはそれを指しているオブジェクトを参照していないことを意味しますまったくのオブジェクト

今、あなたのコードでは、あなたがどこ（正確に）あなたがエラーを取得していると言うが、この2行はかかりませんでした：あなたがエラーを取得している場合は

node.appendChild(textnode); 
    document.getElementById(id).appendChild(node); 

を最初の行の場合は、node変数は実際には何も参照しません。エラーが2行目であれば、document.getElementById(id)が実際のオブジェクトを返さない場合は、そこで使用しているid変数が実際にHTML要素のidと一致するかどうかを確認する必要があります。

そして、もちろん、あなたのコードが実行されるときに知ることが重要です。

document.getElementById(id) 

要素がDOMに解析される前に要素の位置を特定しようとしている可能性があります。