爲什麼我需要使用document.write而不是DOM操作方法？

Question

我正在嘗試新的廣告服務，並且據我所知他們沒有提供加載廣告的功能界面。我們希望根據用戶的屏幕尺寸顯示不同的廣告尺寸，並且此服務要求您爲每種尺寸加載不同的.js URL。

我最初試圖寫：

<script type="text/javascript"><!-- 
    var dochead = document.getElementsByTagName('head')[0]; 
    var newscript = document.createElement('script'); 
    newscript.type = "text/javascript"; 
    newscript.src = '//ads-by.madadsmedia.com/tags/22430/9194/async/' + (screen.width >= 1360 ? '160' : '120') + 'x600.js'; 
    dochead.appendChild(newscript); 
    //--> 
</script> 

，但我只是得到了一個空白頁。我查看了Chrome開發人員工具，似乎正在正確加載他們的腳本。他們的腳本從谷歌加載其他腳本，並且他們也出現在DOM中。但是沒有廣告圖片。

當我改變了我的腳本：

<script language="JavaScript" type="text/javascript"> 
var prot = document.location.protocol; 
var adwidth = (screen.width >= 1360 ? '160' : '120'); 
document.write('<script language="JavaScript" type="text/javascript"'); document.write('src="'+prot+'//ads-by.madadsmedia.com/tags/22430/9194/async/'+adwidth+'x600.js">'); document.write('<\/scr' + 'ipt>'); 
</script> 

一切正常。我通常不喜歡使用document.write，我想知道爲什麼它需要在這種情況下？廣告服務的腳本廣泛使用document.write，這是爲什麼？

Answer 1

如果文檔正在加載它的就緒狀態是交互式的，但body元素尚未被完全解析。您不能將子項添加到尚未加載的元素。它會導致錯誤並停止腳本。

dochead.appendChild（newscript）;

快速修復是使用body.onload事件來運行你的函數。將腳本移動到頁面底部可能會有效，但在包含Internet Explorer和行爲不端的瀏覽器的世界中，我不認爲這是可靠的。