1.會覆蓋頁面的情況
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="www.google.com" />
<title>螞蟻部落</title>
<script type="text/javascript">
window.οnlοad=function(){
document.write("分享互助");
}
</script>
</head>
<body>
<div>螞蟻部落歡迎您</div>
</body>
</html>從以上代碼的可以看出document.write()函數將原來的文檔內容清空了，下面介紹一下出現此種情況的原因:
window.onload事件是在文檔內容完全加載完畢再去執行事件處理函數，當然文檔流已經關閉了，這個時候執行doucment.writ()函數會自動調用document.open()函數創建一個新的文檔流，並寫入新的內容，再通過瀏覽器展現，這樣就會覆蓋原來的內容。
2.同樣也是覆蓋掉了原文檔
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My First Paragraph.</p>
<button onclick="myFunction()">點擊這裏</button>
<script>
function myFunction()
{
document.write("糟糕！文檔消失了。");
}
</script>
</body>
</html>點擊button時會覆蓋頁面
不會覆蓋頁面的情況
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<script type="text/javascript">
document.write("分享互助");
</script>
</head>
<body>
<div>螞蟻部落歡迎您</div>
</body>
</html>在以上代碼中，原來的文檔內容並沒有被清空，這是因爲當前文檔流是由瀏覽器所創建，並且document.wirte()函數身處其中，也就是執行此函數的時候文檔流並沒有被關閉，這個時候不會調用document.open()函數創建新文檔流，所以也就不會被覆蓋了。
覆蓋原理解釋:
加載文檔的時候就像是創建了document對象，可以向文件流寫入東西，就像在script標籤裏面直接寫一句
document.write（“123”）;那個document是一邊加載一遍進行寫操作，但是文檔加載成功之後，這個document對象就會關閉了。
如果你這時你又重新加載了文檔，比如說你調用了函數（在js中運行編寫好程序後只是聲明瞭有這個函數，但並沒有調用，所以你一旦調用，就會重新加載文檔），如下
<script>
function reUse（）{
document.write（“123”）;
}
</script>就會新建一個document對象，它會覆蓋你之前的內容。這跟你函數放的位置無關，無論是在其他輸出語句的前後，還是說在head或body裏面寫就不一樣，而是調用的時機，要明確什麼時候文檔會重新加載。
明確覆蓋的原理後，主要在於是否會重新加載文檔。重新加載文檔的時機是什麼：調用函數，或許還有其他。