網絡瀏覽器何時會請求動態創建的iframe的src內容？

Question

假設我使用js動態創建iframe節點，然后設置src屬性（1），最后將該節點附加到DOM（2）。

瀏覽器何時請求src內容？ 在（1）之后？ 在（2）之后？ 還是不可預測的？ 是否取決於瀏覽器？

Answer 1

規范指出：

將iframe元素首次插入文檔時 ，用戶代理必須創建嵌套的瀏覽上下文 ，然后首次處理iframe屬性 。

---

使用以下代碼片段和本地服務器，我已經在許多瀏覽器中測試了該行為。

 var f = document.createElement('iframe'); f.src = '/?'; 

永遠不會獲取資源（我只顯示了最低和最高測試的瀏覽器版本）：

• IE 6-9
• FF 3.6-12.0
• 鍍鉻1-18
• 歌劇10.00-12.00
• Safari 4.0-5.1.5

因此，僅在將框架添加到文檔后才發送請求。

Answer 2

之后（2）。 在此之前只是JS。 在將瀏覽器附加到DOM之前，它不會對其起作用。

Answer 3

好吧，我不會為您測試每個瀏覽器，但我總是希望帶有src和href屬性的元素鏈接到或加載某種內容，並在它們被實際附加后始終加載，因為iframe或js文件因大量安全性和一般實現問題而落入文檔中。 瀏覽器供應商以其他任何方式做到這一點將是嚴重的失敗，我可以發現chrome經過一點試驗就可以做到這一點。

我能想到的唯一例外是可以在插入之前加載的圖像。

Answer 4

以我的經驗，總是將節點添加到DOM中。 您可以加載Firebug或其他開發控制台，並查看何時發生。 拋出幾個警報，以確保像這樣的時間：

<script type="text/javascript">
    ifrm = document.createElement("IFRAME"); 
    ifrm.setAttribute("src", "http://blah.com/");
    alert('SRC SET'); 
    ifrm.style.width = 640+"px"; 
    ifrm.style.height = 480+"px"; 
    document.body.appendChild(ifrm);
    alert('ADDED TO DOM');
</script>

運行類似的內容，並在Firebug中查看“ Net”選項卡，以查看何時請求該頁面。 我相信只有在調用appendChild之后才會請求它。

Answer 5

之后（2）!! 看看這個： http : //jsfiddle.net/lbstr/td7DD/

打開firebug或chrome的控制台，然后查看net選項卡。 您會看到Google正在加載。 然后，注釋掉第三行並再次運行。 您不會看到Google正在加載。