首頁 web前端 js教程 JS腳本defer的作用範例介紹

JS腳本defer的作用範例介紹

May 16, 2016 pm 05:05 PM
defer js腳本

defer作用是文件載入完畢了再執行腳本,這樣迴避免找不到物件的問題,下面有個不錯的範例,有興趣的朋友可以參考下。

<script src="../cgi-bin/delscript.js" defer></script> 
中的defer作用是文档加载完毕了再执行脚本,这样回避免找不到对象的问题---有点问题 
<button id="myButton" onclick="alert(&#39;ok&#39;)">test</button> 
<script> 
myButton.click(); 
</script> 
<script> 
myButton.click(); 
</script>
<button id="myButton" onclick="alert(&#39;ok&#39;)">test</button> 
<script defer> 
function document.body.onload() { 
alert(document.body.offsetHeight); 
} 
</script>
登入後複製

加上 defer 等於在頁面完全在入後再執行,相當於 window.onload ,但應用上比 window.onload 更有彈性! 

defer是腳本程式強大功能中的一個「無名英雄」。它告訴瀏覽器Script段包含了無需立即執行的程式碼,並且,與SRC屬性聯合使用,它還可以使這些腳本在後台被下載,前台的內容則正常顯示給用戶。
但是文件載入完畢了再執行腳本 

最後請注意兩點: 

1、不要在defer型的腳本程式段中呼叫document.write指令,因為document.write將產生直接輸出效果。
2、而且,不要在defer型腳本程式段中包含任何立即執行腳本要使用的全域變數或函數。 

一個常用的最佳化效能的方法是:當腳本不需要立即執行時,在<script>標籤中設定「defer」屬性。 (立即腳本沒有被包含在一個function區塊中,因此會在載入過程中執行。) 設定「defer」屬性後,IE就不必等待該腳本裝載和執行完畢。這樣頁面載入會比較快。一般來說,這也表示立即腳本最好放在function區塊中,並在document或body物件的onload 句柄中處理該函數。在有一些腳本需要依賴使用者操作而執行時----例如點擊按鈕,或移動滑鼠到某個區域----使用該屬性非常有用。但當有一些腳本需要在頁面載入過程中或載入完成後執行,使用defer屬性得到的好處就不太大。 </script>

都是defer惹的禍,這兩天網站查看全文出錯的原因。

上週末,本站投放了Google廣告,當時為了防止廣告的投入延長頁面導入的時間,修改了下Google Ad代碼,使用了defer延遲導入廣告,我一直使用的是FireFox瀏覽器,一直沒發現有問題。今天,有朋友上本站查資料,她用的是Maxthon,告訴我一查看文章,頁面就一閃就過去了,這才知道有問題,我說這兩天這麼網站的訪問一直在掉呢?一查原因,才發現是defer的原因,因為在Firfox中defer好像是失效的,頁面實際還是原始內容一起載入了,而在IE中,由於推遲載入腳本,對於Google Ad腳本來說,其使用的是Document.write的寫入方法,並且因為defer的原因。 Google AD的腳本檢測為iframe了,所以當獲取到Google 廣告的實際內容的時候就把整個頁面給覆蓋了,也就造成了查看全文一閃而過的現象。

這都怪我修改了程式碼沒這麼測試,以後不管改什麼都需要在IE和FireFox中都測試通過才可以,對於這兩天造成大家的訪問困難致以最最真摯的道歉!
另:推薦大家使用FireFox造訪本站,存取和解析速度以及頁面佈局的一致性都更好!

以上就是本章的全部內容,更多相關教學請訪問JavaScript影片教學

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

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

AI Clothes Remover

AI Clothes Remover

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

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

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

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

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

edge瀏覽器js腳本停用方法 edge瀏覽器js腳本停用方法 Jan 07, 2024 am 11:17 AM

隨著edge瀏覽器的新版更新後很多的小伙伴都很不適應就比如都不知道該怎麼禁用js腳本,今天就為各位帶來了edge瀏覽器js腳本禁用的方法,一起來學習下吧。 edge瀏覽器js腳本:1、開啟瀏覽器,點選右上角的三個點,選擇「設定」。 2、點選左側工作列的「進階」。 3、下拉找到「網站權限」並點選「管理許可」。 4、在「站點權限」中找到「JavaScript」。 5、將其後面的開關關閉即可。

Go 語言中的 defer 關鍵字是什麼? Go 語言中的 defer 關鍵字是什麼? Jun 11, 2023 am 09:10 AM

Go語言中的defer關鍵字是什麼?在編寫程式時,我們經常需要在某個函數或方法執行完畢後,執行一些清理或資源釋放工作。這個時候,Go語言提供了一種方便的機制,透過使用defer關鍵字,可以將這些清理或資源釋放工作推遲到函數或方法返回之前執行。 defer關鍵字是一個編譯時解析的語法糖,它透過將一個函數或方法的呼叫推遲到當前函數或方法傳回之前執行,

Go語言中延遲執行語句是什麼 Go語言中延遲執行語句是什麼 Jan 11, 2023 pm 06:28 PM

在Go語言中,延遲執行語句是defer語句,語法「defer 任意語句」。 defer語句會將其後面跟隨的語句進行延遲處理,在defer歸屬的函數即將返回時,將延遲處理的語句按defer的逆序進行執行;也就是說,先被defer的語句最後被執行,最後被defer的語句,最先被執行。

golang函數的defer和panic golang函數的defer和panic Apr 20, 2024 am 11:06 AM

defer和panic關鍵字用於控制異常和後置處理:defer:將函數壓入棧,在函數返回後執行,常用於釋放資源。 panic:拋出異常,中斷程式執行,用於處理無法繼續運作的嚴重錯誤。區別:defer僅在函數正常返回時執行,而panic會在任何情況下執行,即使發生錯誤。

Golang函式的關鍵字defer和recover配合使用方法 Golang函式的關鍵字defer和recover配合使用方法 May 15, 2023 pm 11:21 PM

Golang是一種高效,簡潔且易於學習的程式語言,它最初由Google開發,並於2009年首次發布。它的設計目標是提高程式設計師的生產力和程式碼清晰度。在Golang中,函數的關鍵字defer和recover經常配合使用,用於處理程式中可能出現的錯誤。本文將介紹這兩個關鍵字的使用方法,並透過一些範例說明它們的實際應用。一、defer的使用方式defer是關鍵字

Golang函數的defer關鍵字的多種用法 Golang函數的defer關鍵字的多種用法 May 17, 2023 am 09:01 AM

Golang是一種非常流行的程式語言,其語言特性非常豐富,其中之一就是使用defer關鍵字來完成一些特定的功能。在本文中,我們將會介紹多種使用defer關鍵字的方式。延遲函數的執行在Golang中,defer關鍵字最常用的功能就是延遲函數的執行。這意味著,當函數執行完畢之後,被defer關鍵字包裝的函數會延遲執行。例如,我們可以使用defer關鍵字來列印日

Go 語言中的 defer 與 panic 的關係是什麼? Go 語言中的 defer 與 panic 的關係是什麼? Jun 11, 2023 am 09:00 AM

Go語言是一種新式的程式語言,它新增了一些特色的語法和特性,其中defer和panic是其中兩個非常重要的特性。本文將會介紹Go語言中defer和panic的關係以及它們的用法和特徵。 defer的用法Go語言中的defer語句用來註冊一個函數,當這個函數執行結束或目前作用域結束時,會自動執行這個被註冊的函數。 defer可以用

Golang 函數 defer 的執行順序和用途 Golang 函數 defer 的執行順序和用途 Jun 05, 2024 pm 01:10 PM

defer函數在Go語言中用於延遲函數呼叫到函數返回前執行,並依後進先出(LIFO)的順序呼叫。其用途包括釋放資源、記錄日誌和復原異常。後延遲的函數將在先延遲的函數之前呼叫。

See all articles