動態加載iframe源代碼

Question

我在我的頁面上嵌入了一些Google地圖嵌入代碼;這些讓我的頁面變慢，所以我想在加載頁面後加載它們，所以我正在嘗試這樣的事情。不幸的是，地圖的iframe來源發生了變化，但地圖不會在裏面加載，只是空白。

例如鏈接：

<iframe width="300" height="300" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.co.in/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=Megarugas+Banquet+and+Lawn,+Opp.+Chandivali+studio,&amp;aq=&amp;sll=19.127228,72.865035&amp;sspn=0.013259,0.022724&amp;ie=UTF8&amp;hq=Megarugas+Banquet+and+Lawn,+Opp.+Chandivali+studio,&amp;hnear=&amp;t=m&amp;cid=15174344858031542989&amp;ll=19.115165,72.894802&amp;spn=0.024329,0.025663&amp;z=14&amp;iwloc=A&amp;output=embed"></iframe><br /><small><a href="https://maps.google.co.in/maps?f=q&amp;source=embed&amp;hl=en&amp;geocode=&amp;q=Megarugas+Banquet+and+Lawn,+Opp.+Chandivali+studio,&amp;aq=&amp;sll=19.127228,72.865035&amp;sspn=0.013259,0.022724&amp;ie=UTF8&amp;hq=Megarugas+Banquet+and+Lawn,+Opp.+Chandivali+studio,&amp;hnear=&amp;t=m&amp;cid=15174344858031542989&amp;ll=19.115165,72.894802&amp;spn=0.024329,0.025663&amp;z=14&amp;iwloc=A" style="color:#0000FF;text-align:left">View Larger Map</a></small> 

HTML：

<iframe id="blabla"></iframe> 

JS：

$(window).load(function() { 
    if ($('#blabla').length <= 0) { return; } // to avoid errors in case the element doesn't exist on the page/removed. 
    $('#blabla').attr('src','//example.com/page'); 
}); 

Answer 1

的SRC不會在腳本中進行解析，則必須將其替換的&所有occurencies &

你不需要自己做這件事。

創建一些元素，在html設置到src，然後檢索元素的文本：

$(window).load(function() { 
    $('#blabla').attr('src',$('<span/>').html('https://example.com/page').text()); 
}); 

附加說明： 你並不需要檢查的$('#blabla')長度，你會當jQuery對象爲空時不會收到錯誤。