iframe如何動態創造及釋放其所佔記憶體_javascript技巧
最近參與一個專案的開發,由於專案是基於瀏覽器的胖客戶端(RIA)應用程序,頁面中大量調用iframe。後製測試發現瀏覽器記憶體一直居高不下,而且開啟iframe頁面越多記憶體佔用越大,在IE系列瀏覽器中尤其明顯。所有開啟的iframe頁面即使關閉了,記憶體使用也沒有明顯的下降,IE瀏覽器在記憶體佔用達到400M左右就變得很卡牌。分析發現是iframe沒有釋放造成的,於是對所有已關閉的iframe所佔用的內存進行釋放,雖然不能完全釋放,但是iframe內存佔用量不會一直增長,整個應用內存使用量控制在150M左右。
/** * 动态创建iframe * @param dom 创建iframe的容器,即在dom中创建iframe。dom可以是div、span或者其他标签。 * @param src iframe中打开的网页路径 * @param onload iframe加载完后触发该事件,可以为空 * @return 返回创建的iframe对象 */ function createIframe(dom, src, onload){ //在document中创建iframe var iframe = document.createElement("iframe"); //设置iframe的样式 iframe.style.width = '100%'; iframe.style.height = '100%'; iframe.style.margin = '0'; iframe.style.padding = '0'; iframe.style.overflow = 'hidden'; iframe.style.border = 'none'; //绑定iframe的onload事件 if(onload && Object.prototype.toString.call(onload) === '[object Function]'){ if(iframe.attachEvent){ iframe.attachEvent('onload', onload); }else if(iframe.addEventListener){ iframe.addEventListener('load', onload); }else{ iframe.onload = onload; } } iframe.src = src; //把iframe加载到dom下面 dom.appendChild(iframe); return iframe; } /** * 销毁iframe,释放iframe所占用的内存。 * @param iframe 需要销毁的iframe对象 */ function destroyIframe(iframe){ //把iframe指向空白页面,这样可以释放大部分内存。 iframe.src = 'about:blank'; try{ iframe.contentWindow.document.write(''); iframe.contentWindow.document.clear(); }catch(e){} //把iframe从页面移除 iframe.parentNode.removeChild(iframe); }

熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

內嵌框架在HTML中稱為iframe。標籤指定內容中的一個矩形區域,瀏覽器可以在其中顯示帶有捲軸和邊框的不同文件。若要在目前HTML文檔中嵌入另一個文檔,請使用內嵌框架。可以使用HTMLiframe名稱屬性指定元素的參考。在JavaScript中,對元素的參考也是使用name屬性進行的。 iframe本質上用於在目前顯示的網頁中顯示網頁。包含iframe的文件的URL使用「src」屬性指定。語法以下是HTML的語法<iframesrc="URL"title="d

iframe載入慢的原因主要包括網路延遲、資源載入時間長、載入順序、快取機制以及安全性策略等。詳細介紹:1、網路延遲,當瀏覽器載入一個包含iframe的網頁時,需要發送請求到伺服器取得iframe中的內容,若網路延遲較高,那麼取得內容的時間就會增加,從而導致iframe載入慢;2.資源載入時間長,資源的大小較大或伺服器回應時間較長時,載入速度會更明顯變慢;3、載入順序等等。

iframe中的data-id是指在HTML標籤中使用的自訂屬性,用於儲存特定元素的識別碼。透過使用data-id屬性,可以為iframe元素新增一個唯一的標識符,以便在JavaScript中對其進行操作和存取。 data-id屬性的命名可以根據特定的需求進行自定義,但通常會遵循一些命名規範,以確保其唯一性和易讀性。 data-id屬性也可以用來識別和操作特定的iframe。

當用戶透過Safari瀏覽器存取電子郵件服務時,微軟的Outlook正在macOS上下載一個名為「TokenFactoryIframe」的神秘檔案。發現Outlook在每次造訪時下載的「TokenFactoryIframe」檔案的使用者現在已廣泛報告此問題。 Outlook每隔幾秒鐘或至少每次造訪Apple平台上的Outlook時都會下載此神祕檔案。根據我們的調查結果,這似乎是由發佈到Outlook的伺服器端更新錯誤所引起的問題,與Safari或macOS無關。微軟在一份

可以取代iframe的技術有Ajax、JavaScript庫或框架、Web元件技術、前端路由和伺服器端渲染等。詳細介紹:1、Ajax是一種用來建立動態網頁的技術。它可以透過在後台與伺服器進行資料交換,實現頁面的非同步更新,而無需刷新整個頁面,使用Ajax可以更靈活地載入和顯示內容,不再需要使用iframe來嵌入其他頁面;2、JavaScript庫或框架,如React等等。

Go語言提供了兩種動態函數創建技術:closures和反射。 closures允許存取閉包作用域內的變量,而反射可使用FuncOf函數建立新函數。這些技術在自訂HTTP路由器、實現高度可自訂的系統和建置可插拔的元件方面非常有用。

iframe的載入事件有onload事件、onreadystatechange事件、onbeforeunload事件、onerror事件、onabort事件等。詳細說明:1、onload事件,指定載入iframe完成後要執行的JavaScript程式碼;2、onreadystatechange事件,指定當iframe狀態變更時要執行的JavaScript程式碼等等。

iframe中的危險主要有:1、安全漏洞,惡意的網頁可以透過iframe載入其他網頁,並進行一些攻擊行為;2、同源策略突破,透過在iframe中載入其他網域下的網頁,能突破同源策略,實現跨域通信,這可能會被惡意攻擊;3、程式碼執行問題,在iframe中載入的網頁可以執行JS程式碼,這可能導致一些安全性問題;4、SEO問題,搜尋引擎可能無法正確解析和索引透過iframe載入的內容等等。
