【小白】javascript中的“文件已完成載入後執行 document.write，整個 HTML 頁面將被覆蓋”
阿新 • • 發佈：2019-01-07
document.write已經遇到過好幾次了，還是得弄弄清楚。
W3cschool上面有一道練習題，如下（圖片1）
結果輸入的時候h1跟p段落全部被覆蓋，只有語句“糟糕！文件消失了”
圖片中出現的關鍵字“如果在文件已完成載入後執行 document.write，整個 HTML 頁面將被覆蓋”。
疑問1：document.write的工作原理是什麼，為什麼會覆蓋
疑問2：什麼叫做“文件已完成載入”
載入文件的時候就像是建立了document物件，可以向檔案流寫入東西，就像在script標籤裡面直接寫一句
<script>
document.write（“123”）;
</script>
那個document是一邊載入一遍進行寫操作，但是文件載入成功之後，這個document物件就會關閉了。
如果你這時你又重新載入了文件，比如說你呼叫了函式（在js中執行編寫好程式後只是聲明瞭有這個函式，但並沒有呼叫，所以你一旦呼叫，就會重新載入文件），如下
<script>
function reUse（）{
document.write（“123”）;
}
</script>
就會新建一個document物件，它會覆蓋你之前的內容。這跟你函式放的位置無關，無論是在其他輸出語句的前後，還是說在head或body裡面寫就不一樣，而是呼叫的時機，要明確什麼時候文件會重新載入。明確覆蓋的原理後，主要在於是否會重新載入文件。重新載入文件的時機是什麼：呼叫函式，或許還有其他。