7. ページを作る
ページというのは Dynamic HTML でも使わない限り、
状況によって変えるのはなかなか難しいですが、
JavaScriptによってページを作るというのは可能です。
function test1(form) {
var str = form.text1.value;
document.open("text/html"); //新しいページを開く
document.writeln("<HTML><BODY>");
for(var i = 3; i <= 7; i++) //iで指定したサイズで
document.writeln("<FONT SIZE=" //書く
+ i + ">" + str + "</FONT><P>")
document.writeln("</BODY></HTML>");
document.close(); //閉じる
}
テキストボックスに何か言葉を入れてボタンを押してください。
そうすると例えば以下のコードと同じページが現れます。
<HTML><BODY>
<FONT SIZE=3>ほえ</FONT><P>
<FONT SIZE=4>ほえ</FONT><P>
<FONT SIZE=5>ほえ</FONT><P>
<FONT SIZE=6>ほえ</FONT><P>
<FONT SIZE=7>ほえ</FONT><P>
</BODY></HTML>
新しいページを作るときはまず最初に、
document.open("text/html");
とします。引数にはあまり意味が無くて省略も可能ですが、
なんとなくそうします。
次に、本文を書きます。
document.writeln("何か書く");
引数がそのままHTML文になります。
ここでは document オブジェクトの
writeln メソッドを使っていますが、
これだと終端に改行が入ります。これは次と同じです。
document.write("何か書く\n");
最後に必ず、
document.close();
とします。
このように作られたページは Internet Explorer では注意を要します。
まず、3.0では『戻る』を押すと前の前のページに戻ってしまいます
(あるいは『戻る』が淡色表示になっているかもしれません)。
前のページに戻るには『更新』を押します。
また、 [編集] - [現在のページ] を選んでも、
前のページのソースが表示されます。
4.0ではかなり改善されましたが、まだソースの表示がおかしいようです
(上の例では日本語でもうまくいっています、正式版で直ったか?)。
Netscape Navigator ではいったん
document.
open("text/html")
とするとページ上のオブジェクトは見えなくなります。
hidden オブジェクトなどページに貼り付けたオブジェクトはもちろん、
サブルーチンもグローバルな変数も見えなくなります。例えば次のようです。
function writehtml() {
document.write("<html><body>aaaaaa</body></html>");
}
function test2() {
document.open("text/html");
writehtml();
document.close();
}
ボタンを押すと test2() が実行されるのですが、Netscape Navigator 4.04 では
writehtml is not defined.
というメッセージが出てしまいます。
これを避けるには、
function writehtml() {
return "<html><body>aaaaaa</body></html>";
}
function test2() {
var str = writehtml(); //書き込む内容を記憶する
document.open("text/html");
document.write(str); //openした後書く
document.close();
}
などと、
open する前に、
書き込む文字列の全てをあらかじめ記憶しておくのがよいでしょう。
のように、ページの途中で document.write
を使うことができます。ソースは次。
<SCRIPT LANGUAGE="JavaScript">
var d = new Date(); //現在の時刻
document.write(d.toString()); //時刻を文字列に変換して表示
</SCRIPT>
実行されるのはロードされた時です。Dateオブジェクトについては
こちら。