這篇文章主要介紹了JS 中document.write()的用法和清空的原因淺析,需要的朋友可以參考下

可能很多朋友都遇到過(guò)這樣的情況，那就是使用document.write()函數(shù)向網(wǎng)頁(yè)中寫內(nèi)容的時(shí)候，會(huì)把文檔中的原來(lái)的內(nèi)容給清空，這一點(diǎn)對(duì)于初學(xué)者來(lái)說(shuō)算是一個(gè)困擾，下面就介紹一下為什么會(huì)出現(xiàn)這種情況，當(dāng)然也就知道如何避免此種情況的發(fā)生了。

先看一段代碼實(shí)例:

Document

window.οnlοad=function(){

document.write("重溫 JavaScript");

}

Hello JavaScript

從以上代碼的可以看出document.write()函數(shù)將原來(lái)的文檔內(nèi)容清空了，下面介紹一下出現(xiàn)此種情況的原因:

window.onload事件是在文檔內(nèi)容完全加載完畢再去執(zhí)行事件處理函數(shù)，當(dāng)然文檔流已經(jīng)關(guān)閉了，這個(gè)時(shí)候執(zhí)行doucment.writ()函數(shù)會(huì)自動(dòng)調(diào)用document.open()函數(shù)創(chuàng)建一個(gè)新的文檔流，并寫入新的內(nèi)容，再通過(guò)瀏覽器展現(xiàn)，這樣就會(huì)覆蓋原來(lái)的內(nèi)容。不過(guò)很多朋友還有會(huì)這樣的疑問(wèn)，為什么類似下面的情況，原來(lái)網(wǎng)頁(yè)中的內(nèi)容不會(huì)被覆蓋,代碼如下:

Document

document.write("重溫 JavaScript");

Hello JavaScript

在以上代碼中，原來(lái)的文檔內(nèi)容并沒(méi)有被清空，這是因?yàn)楫?dāng)前文檔流是由瀏覽器所創(chuàng)建，并且document.wirte()函數(shù)身處其中，也就是執(zhí)行此函數(shù)的時(shí)候文檔流并沒(méi)有被關(guān)閉，這個(gè)時(shí)候不會(huì)調(diào)用document.open()函數(shù)創(chuàng)建新文檔流，所以也就不會(huì)被覆蓋了。可能還有朋友會(huì)問(wèn)為什么下面的方式還是不行，代碼如下:

Document

document.close();

document.write("重溫 JavaScript");

Hello JavaScript

上面使用document.close()關(guān)閉文檔流了，為什么還是不能夠覆蓋原來(lái)的內(nèi)容的，很遺憾，文檔流是由瀏覽器創(chuàng)建，無(wú)權(quán)限手動(dòng)關(guān)閉，document.close()函數(shù)只能夠關(guān)閉由document.open()函數(shù)創(chuàng)建的文檔流。看下面的代碼實(shí)例:

Document

function create(){

var newWindow=window.open("","Document","_blank");

newWindow.document.write("Hello JavaScript");

newWindow.document.close();

newWindow.document.write("覆蓋后的輸出");

}

window.οnlοad=function(){

var obt=document.getElementById("bt");

obt.οnclick=function(){

create();

}

}

Hello JavaScript

由doucment.open()創(chuàng)建的文檔流就可以由document.close()關(guān)閉，那么第二個(gè)document.write()輸出的內(nèi)容會(huì)覆蓋掉第一個(gè)輸出的內(nèi)容。

異步引用外部JavaScript時(shí)，必須先運(yùn)行document.open()清空文檔，然后才能運(yùn)行document.write()，參數(shù)寫在body內(nèi)容的開頭。

如果不先運(yùn)行document.open()，直接運(yùn)行document.write()，則無(wú)效且Chrome有如下提示：

// asyncWrite.js

document.open();

document.write('

test

');

document.close();

test

document.write()也能寫入含有script標(biāo)簽的字符串，但是需要轉(zhuǎn)義。寫入的script標(biāo)簽中的內(nèi)容會(huì)正常運(yùn)行。

document.write('

");<\/script>');

document.write('

");<\/script>');

");

test

document.write()可以傳入多個(gè)參數(shù)。

document.write('

multiArgument

','

test

');

document.write('

multiArgument

','

test

');

multiArgument

test

上面是我整理給大家的，希望今后會(huì)對(duì)大家有幫助。

相關(guān)文章：

與50位技術(shù)專家面對(duì)面20年技術(shù)見證，附贈(zèng)技術(shù)全景圖

總結(jié)

以上是生活随笔為你收集整理的php document.write,在JS中有关document.write()的用法（详细教程）的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。