3

HTMLテキスト領域からテキストを取得しようとしています。「送信」ボタンが押されたときにcreate（）メソッドを呼び出します。このメソッドは、テキスト領域からのメッセージを使用して、それをクラス付きの独自のpタグに投稿し、独自のpタグと独自のクラスに日付スタンプを投稿しようとしています。

これらは両方ともdivの「コメント」に含まれます。私が（Chromeの開発者ツールを使用して）取得しているエラーは、

Uncaught TypeError：nullのメソッド'appendChild'を呼び出すことはできません。

これは「cmt.appendChild（divTag）;」を対象としています。私はJavascriptを初めて使用しますが、これはスキルを向上させるための練習にすぎません。すべての助けは大歓迎です！

var cmt = document.getElementById('comments');

function create() {

    var username = 'User',
        message = document.getElementById("textBox").value,
        divTag = document.createElement('div'),
        p1 = document.createElement('p'),
        p2 = document.createElement('p');

    divTag.className = 'comment';

    p1.className = 'date';
    p1.innerHTML = new Date();
    divTag.appendChild(p1);

    p2.className = 'message';
    p2.innerHTML = username + ': ' +message;
    divTag.appendChild(p2);

    cmt.appendChild(divTag);
}
4

3 に答える 3

6

表示されるエラーは、ページに「コメント」というIDを持つ要素がないことを示しています。そのようなIDを持つ要素が見つからない場合document.getElementByIdに返されるため、として実行されます。nullcmd.appendChild(divTag)null.appendChild(divTag)

要素が存在することが確実な場合は、その要素がブラウザによって作成される前にcmt変数を割り当てるJavaScriptを実行している可能性があります。これを防ぐための標準的な方法は、外部JavaScriptを含むタグを終了タグの直前に配置することです。<script></body>

何らかの理由でスクリプトタグを移動できない場合は、$(document).ready()（jQuery）または同等の変数を割り当てるコードを実行してみてください。

于 2013-02-18T22:27:54.107 に答える
1

必要な要素が存在する場合、コードは機能します。あなたがこのフィドルで見ることができるように。

HTMLが次のような場合に機能します。

<div id="comments">
    <input id="textBox" type="textBox" value="Hello" />
</div>

私の推測では、識別子の1つがスペルミスであるか、期待どおりの要素が存在しない可能性があります。

ただし、外部ファイルでスクリプトを実行している場合は、ドキュメントが完全に読み込まれる前に実行しようとする可能性があるため、スクリプトはDOMでまだ準備ができていない要素を参照しています。

jQueryでは、ラップアラウンドし$(document).ready(function(){// your code here..})ます。
このSOの投稿には、JavaScriptだけでこれを行う方法の詳細がいくつかあります：jQueryなしのDocumenReadyと同等です。

于 2013-02-18T22:30:52.377 に答える
1

実際、彼のコードは問題ありません。そのJavaScriptはHTMLの前に実行されます。簡単な修正は、すべてのコードを任意の名前の関数内にネストすることです。次に、window.onloadを使用して、HTMLがロードされた後に関数を実行します。だから基本的に：

window.onload = function any_name()
{
//code to be executed
}

これは、スクリプトタグを移動したくない場合に特に便利です。私は通常、タグをそのままにしておくのが好きです。

于 2014-02-27T21:45:49.147 に答える