ページが読み込まれた後、ブラウザ出力ストリームが自動的に閉じられていることに注意してください。この後、現在のページで動作するdocument.write()メソッドは、現在のページの内容(ソースドキュメントの変数または値を含む)をクリアする新しい出力ストリームを開きます。したがって、現在のページをスクリプトによって生成されたHTMLに置き換える場合は、HTMLコンテンツを接続して変数に割り当て、document.write()メソッドを使用して書き込み操作を完了する必要があります。ドキュメントをクリアして新しいデータストリームを開くことなく、document.write()コールはすべてを実行できます。
document.write()メソッドについて説明するもう1つのことは、その関連メソッドdocument.close()です。スクリプトがコンテンツをウィンドウ(このウィンドウまたは他のウィンドウであっても)に書き込み後、出力ストリームを閉じる必要があります。遅延スクリプトの最後のdocument.write()メソッドの後、document.close()メソッドが含まれていることを確認する必要があります。そうしないと、画像やフォームを表示することはできません。また、その後呼び出されたdocument.write()メソッドは、既存のコンテンツをクリアして新しい値を書き込むことなく、コンテンツをページに追加するだけです。 document.write()メソッドを実証するには、同じアプリケーションの2つのバージョンを提供します。 1つはスクリプトを含むドキュメントにコンテンツを書き、もう1つはコンテンツを別のウィンドウに書き込みます。テキストエディターの各ドキュメントをクリックして、.htmlファイル拡張子で保存し、ブラウザでドキュメントを開きます。
例1ドキュメントの新しいHTMLコンテンツを組み合わせたボタンを作成します。これには、新しいドキュメントタイトルのHTMLタグやタグの色属性が含まれます。この例には、読者に馴染みのないオペレーター +=があります。右側の文字列を左側の変数に追加します。この変数は、文字列の保存に使用されます。この演算子は、いくつかの個別のステートメントを長い文字列に簡単に組み合わせることができます。 newContent変数に組み合わされたコンテンツを使用して、document.write()ステートメントはすべての新しいコンテンツをドキュメントに記述し、例1のコンテンツを完全にクリアできます。次に、document.close()ステートメントを呼び出して出力ストリームを閉じる必要があります。ドキュメントをロードしてボタンをクリックすると、その結果、ブラウザのタイトルバーのドキュメントタイトルが変更されることに気付くことができます。元のドキュメントに戻ってボタンをもう一度クリックすると、2番目のページが元のドキュメントをリロードするよりも速く動的にロードされることがわかります。
例1現在のウィンドウでdocument.write()を使用します。
< xmlns = "http://www.w3.org/1999/xhtml"> <title>同じdocへの執筆</title> <スクリプト言語= "javascript"> function rewrite(){// new window var newcontent = "<html> <head> </title> <head> <head> <head> bgcolor = 'aqua'> <h1>このドキュメントは真新しいです。</h1> "newContent +="バックボタンをクリックして元のドキュメントを表示します。 " newContent += "</body> </html>" // htmlを新しいウィンドウに書くdocument.write(newcontent)document.close()// close layout stream} </script> </head> <body> <form> <input intyp = "button" value = "content" onclick = "例2では、スクリプトがスクリプトによって生成されたドキュメント全体が記述される子ウィンドウを作成するため、状況は少し複雑です。両方の関数で新しいウィンドウへの参照をアクティブに保つために、NewWindow変数をグローバル変数として宣言します。ページがロードされると、オンロードイベントハンドラーは、空の子ウィンドウを生成するMakenewWindow()関数を呼び出します。さらに、window.open()メソッドの3番目のパラメーターにプロパティを追加して、子ウィンドウのステータスバーを表示します。
ページのボタンはsubwrite()メソッドを呼び出し、最初に実行するタスクは、子ウィンドウの閉じたプロパティを確認することです。参照ウィンドウが閉じている場合、このプロパティ(新しいブラウザバージョンにのみ存在する)がtrueを返します。この場合(ユーザーがウィンドウを手動で閉じる場合)、関数はMakenewWindow()関数を呼び出してウィンドウを再開します。
ウィンドウが開いた後、新しいコンテンツは文字列変数として組み合わされます。例1のように、一度にコンテンツを記述します(ただし、別のウィンドウには必要ありませんが)。次に、close()メソッドを呼び出します。ただし、1つの重要な違いは、write()とclose()メソッドの両方が子供の窓を明確に指定していることに注意してください。
例2別のウィンドウでdocument.write()を使用します
< xmlns = "http://www.w3.org/1999/xhtml"> <title> subwindowへの執筆</title> <スクリプト言語= "javascript"> var newwindow function makenewwindow(){newwindow = window.open( ""、 "、" "" "、wathe、wather = 200、width = 300") new window if someone has closed it if(newWindow.closed){ makeNewWindow() } // bring subwindow to front newWindow.focus() // assemble content for new window var newContent = "<html><head><title>A New Doc</title></head>" newContent += "<body bgcolor='coral'><h1>This document is brand new。</h1> "newContent +=" </body> </html> "// htmlを新しいウィンドウに書くnewwindow.document.write(newContent)newWindow.document.close()//クローズレイアウトストリーム} </script> </head> <body =" makewindow = " subwindow "onclick =" subwrite() "> </form> </body> </html>