3

日付を今日と比較して差を計算する小さなjsスクリプトを変更しました。(私は初心者です)しかし、それは私が悪いと言われたdocument.writeを使用しています。なぜそれが悪いのか分かりません、人々はそれが悪いと言うだけで、理由を説明することは決してありません。とにかく、私は代替手段を探しています。innerHTMLは機能していないようです。このサイトで回答された他の質問は、実際には質問に回答せずに、DOM操作の参照を示しているだけです。

これが私のスクリプトです:

    //Set the two dates
    var iquit =new Date(2013, 1, 15);
    today=new Date();
    //Get 1 day in milliseconds
    var one_day=1000*60*60*24;
    var day_numeric=Math.ceil((today.getTime()-iquit.getTime())/(one_day));
    //Calculate difference btw the two dates, and convert to days
    document.write("<p>"+day_numeric+
            " days have gone by since you quit smoking!</p>"+
            "<p>You have saved "+ day_numeric*7+" pounds</p>");

誰かがこれを書くためのより良い方法を教えてくれるなら、それは素晴らしいでしょう。

4

3 に答える 3

2

の問題document.write()は、DOMの準備ができた後で呼び出すと、既存のDOMが上書きされることです。このSOの回答document.write()には、めったに最良の選択ではない理由についてのより広範な説明があります。

使用は正常に機能する.innerHTMLはずですが、コンテンツを追加する要素を選択する必要があります。だからこのようなもの:

document.getElementById("idOfSomeElement").innerHTML = "your content";

実例

適切な要素を取得するために使用する方法は、選択する必要があるものによって異なりますが、可能であれば、コンテンツを追加する要素にIDを付加し、上記の方法を使用するのが最も簡単な方法です。

于 2013-02-18T09:46:44.990 に答える
2

純粋なJavaScriptを使用している場合、これを取得するための最良の方法の1つは次のとおりです。

var paragraph1 = document.createElement("p");
paragraph1.appendChild(document.createTextNode(day_numeric+" days have gone by since you quit smoking!"));

var paragraph2 = document.createElement("p");
paragraph1.appendChild(document.createTextNode("You have saved "+ day_numeric*7+" pounds"));

document.body.appendChild(paragraph1);
document.body.appendChild(paragraph2);

100%標準のDOM。

document.writeについて:善か悪か...

document.write生のコンテンツを(X)HTMLドキュメントに出力する低レベルの方法であるため、悪い習慣だと考える人もいると思います。

(X)HTMLは基本的にXMLの方言であるため(または少なくともXMLとSGMLに基づく)、ドキュメントを作成する正しい予想される方法は、ノードを作成し、それらをドキュメント全体に追加することです。

document.write最後に書き込まれた要素の後にコンテンツを書き込むため、新しく作成された要素をドキュメント内のどこに配置するかを決定するときに、多くの制御が失われます。

たとえば、<head>要素からにロードされたJavaScript関数から段落を出力しますか?必ずしもボディにレンダリングされるとは限らないので難しいでしょう。それは残念です。

DOM要素/ノードを作成し、を使用してドキュメントに追加することをお勧めしますappendChild(...)

于 2013-02-18T09:50:14.813 に答える
0

悪い習慣と見なされる理由については、このリンクを確認してください。document.writeが「悪い習慣」と見なされるのはなぜですか。

そして、innerHTMLをどのように使用していますか?

次のようなことを試しましたか

<script>
...
document.getElementById('container-id').innerHTML = "<p>"+day_numeric+" days have gone by since you quit smoking!</p>"+"<p>You have saved "+ day_numeric*7+" pounds</p>";
</script>

これには、次のように、ページのどこかにコンテナIDIDを持つ要素が必要です。

<div id='container-id'></div>
于 2013-02-18T09:49:02.463 に答える