JavaScript 関数で document.write() を使用するとどのような結果が生じますか?

関数呼び出しにおける Document.write() の動作

HTML ドキュメントでは、関数内で document.write() を呼び出すと、次のように予期しない結果が生じる可能性があります。次のコード:

<code class="html"><input type="checkbox" name="thebox" />
<input type="button" onClick="validator()" name="validation" value="Press me for validation" /></code>

<code class="javascript">function validator() {
    if (document.myForm.thebox.checked)
        document.write("checkBox is checked");
    else
        document.write("checkBox is NOT checked");
}</code>

問題: 検証ボタンをクリックすると、フォーム要素 (チェックボックスとボタン) がページから消えます。

説明:

document.write() は、HTML ドキュメントの出力ストリームに直接書き込む強力な関数です。関数内で呼び出された場合、 document.write() には次のような影響があります:

• ドキュメントの読み込みが完了しているため、関数が呼び出された時点でドキュメントの出力ストリームはおそらくすでに閉じられています。
• 閉じたストリームで document.write() を呼び出すと、自動的にドキュメントが開き、既存のコンテンツが上書きされます。

この場合、 validator() が呼び出されると、 document.write() は自動的にドキュメントを再度開きますこれにより、フォーム要素を含むページ全体が消去されます。

解決策:

この動作を回避するには、次のような代替方法を使用してドキュメントのコンテンツを操作する必要があります。 document.createElement() または DOM 操作 API。

以上がJavaScript 関数で document.write() を使用するとどのような結果が生じますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。