JavaScript：document.writeで書かれる場所
JavaScriptでよく使用するメソッドとして、document.writeがある。このメソッドを呼び出したときに文字列が書かれる場所についてメモっておく。
document.writeは、関数の中に記述するか、そうでないかで文字列が書かれる場所が異なる。
- 関数の中に記述した場合：ページの最初から書かれる。（元々の文書は消える）
- 関数の外に記述した場合：document.writeを記述した場所に文字列が書かれる。（元々の文書は残る）
具体的に例を用いて説明する。
関数の中に記述した場合
次のサンプルは、「クリック」ボタンが押された際に、hello()関数が呼び出され、"Hello"という文字を書くという例である。
<html>
<meta http-equiv="Content-Script-Type"
content="text/javascript">
<title>document.write</title>
<body>
<p>最初から書かれている文章。</p>
<input type="button" value="クリック" onclick="hello()">
<script type="text/javascript">
function hello(){
document.write("Hello");
document.close();
}
</script>
</body>
</html>
ページを開いた直後
クリック後
元の文章が消え、"Hello"という文字のみが表示される。
関数の外に記述した場合
次の例は、関数を使わずに、document.writeを使用する例である。
<html>
<body>
<p>最初から書かれている文章。</p>
<script type="text/javascript">
document.write("Hello");
document.close();
</script>
</body>
</html>
ページを開いた直後
元々の文章は消えず、document.writeを書いた場所に文字列が挿入される。
補足
ちなみに、元々の文書を消さずに、イベントドリブンで特定の場所に文字列を追加するには、DOM (Document Object Model) を使えば可能である。詳細は、今回は省略する。
トラックバック(0)
このブログ記事に対するトラックバックURL: http://itsmemo.com/mt/mt-tb.cgi/124
※スパム防止のため、管理人がトラックバック内容確認後、公開されます。
フィード
コメントする