Ingatlah bahwa setelah halaman dimuat, aliran output browser ditutup secara otomatis. Setelah ini, metode dokumen.write () apa pun yang beroperasi pada halaman saat ini akan membuka aliran output baru, yang akan menghapus konten halaman saat ini (termasuk variabel atau nilai dokumen sumber apa pun). Oleh karena itu, jika Anda ingin mengganti halaman saat ini dengan HTML yang dihasilkan oleh skrip, Anda harus menghubungkan konten HTML dan menetapkannya ke variabel, dan menggunakan metode Document.write () untuk menyelesaikan operasi tulis. Tanpa membersihkan dokumen dan membuka aliran data baru, panggilan dokumen.write () dapat melakukan segalanya.
Hal lain yang harus dijelaskan tentang metode Document.write () adalah dokumen metode terkait.close (). Setelah skrip menulis konten ke jendela (apakah ini atau jendela lain), aliran output harus ditutup. Setelah metode terakhir dokumen.write () dari skrip tunda, Anda harus memastikan bahwa metode dokumen.close () disertakan. Jika Anda tidak melakukannya, Anda tidak dapat menampilkan gambar dan formulir. Dan, metode document.write () selanjutnya hanya akan menambahkan konten ke halaman tanpa menghapus konten yang ada untuk menulis nilai baru. Untuk mendemonstrasikan metode Document.write (), kami menyediakan dua versi aplikasi yang sama. Satu menulis konten ke dokumen yang berisi skrip, dan yang lain menulis konten ke jendela terpisah. Silakan klik pada setiap dokumen di editor teks, simpan dengan ekstensi file .html, dan buka dokumen di browser.
Contoh 1 membuat tombol yang menggabungkan konten HTML baru untuk dokumen, termasuk tag HTML untuk judul dokumen baru dan atribut warna tag. Dalam contoh, ada operator += yang tidak akrab bagi pembaca. Ini menambahkan string di sebelah kanannya ke variabel di kiri. Variabel ini digunakan untuk menyimpan string. Operator ini dapat dengan mudah menggabungkan beberapa pernyataan terpisah menjadi string panjang. Menggunakan konten yang digabungkan dalam variabel NewContent, pernyataan Document.write () dapat menulis semua konten baru ke dalam dokumen, sepenuhnya membersihkan konten dalam Contoh 1. Kemudian Anda perlu memanggil pernyataan Document.close () untuk menutup aliran output. Saat memuat dokumen dan mengklik tombol, Anda dapat melihat bahwa judul dokumen di bilah judul browser berubah sebagai hasilnya. Ketika Anda kembali ke dokumen asli dan klik tombol lagi, Anda dapat melihat bahwa halaman kedua yang ditulis secara dinamis memuat lebih cepat daripada memuat ulang dokumen asli.
Contoh 1 Gunakan Document.write () di jendela saat ini.
<! Doctype html public "-// w3c // dtd xhtml 1.0 transisi // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><title>Writing to Same Doc</title><script language="JavaScript"> function reWrite(){ // assemble content for new window var newContent = "<html><head><title>A New Doc</title></head>" newContent += "<body bgcolor = 'aqua'> <h1> Dokumen ini baru. </h1> "newContent +=" Klik tombol Back untuk melihat dokumen asli. " newContent += "</body> </html>" // Tulis html ke dokumen jendela baru dokumen.write (newContent) document.close () // tutup stream tata letak} </script> </head> <body> <form> <input type = "tombol" value = "ganti konten" onklick = "ulang ulang ()"> </form body = "ganti content" onklick = "ulang"> <) <) <) </form =Dalam Contoh 2, situasinya agak rumit karena skrip membuat jendela anak di mana seluruh dokumen yang dihasilkan oleh skrip akan ditulis. Untuk menjaga referensi ke jendela baru aktif di kedua fungsi, kami mendeklarasikan variabel NewWindow sebagai variabel global. Saat halaman dimuat, event handler Onload memanggil fungsi makeNewWindow (), yang menghasilkan jendela anak yang kosong. Selain itu, kami menambahkan properti ke parameter ketiga metode.open () untuk membuat bilah status jendela anak terlihat.
Tombol pada halaman memanggil metode subwrite (), dan tugas pertama yang dilakukannya adalah memeriksa properti tertutup jendela anak. Jika jendela referensi ditutup, properti ini (hanya ada dalam versi browser yang lebih baru) mengembalikan true. Jika ini masalahnya (jika pengguna secara manual menutup jendela), fungsi memanggil fungsi MakeNewWindow () lagi untuk membuka kembali jendela.
Setelah jendela terbuka, konten baru digabungkan sebagai variabel string. Seperti pada Contoh 1, tulis konten sekaligus (meskipun tidak perlu untuk jendela yang terpisah), dan kemudian panggil metode tutup (). Tetapi perhatikan bahwa satu perbedaan penting: baik metode tulis () dan tutup () dengan jelas menentukan jendela anak.
Contoh 2 Gunakan Document.write () di jendela lain
<! Doctype html public "-// w3c // dtd xhtml 1.0 transisi // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"><html xmlns = "http://www.w3.org/1999/xhtml"> <Title> Menulis ke subwindow </iteme> <script language = "javascript"> var function newwindow (status) {light = 300) {300, window = window.open ("", ",", "," 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 baru. </h1> "newContent +=" </body> </html> "// tulis html ke dokumen jendela baru newwindow.document.write (newContent) newwindow.document.close () // tata letak tata letak} </script> </adep Subwindow "OnClick =" SubWrite () "> </form> </body> </html>