移除阻止呈現的JavaScript,移除javascript
歡迎訪問個人原創地址:http://www.phpthinking.com/archives/443
瀏覽器必須先解析網頁,然後才能將其呈現給使用者。如果瀏覽器在解析過程中遇到系統阻止的外部指令碼,必須停止解析並且下載該JavaScript。每次遇到這種情況時,瀏覽器都會增加一個網路往返過程,這樣就會導致首次呈現網頁的時間延遲。
建議
建議您以內嵌方式處理呈現首屏地區所需的JavaScript,並讓為網頁添加其他功能所需的JavaScript消極式載入,直到首屏內容發送完畢為止。請注意,要通過這種方式縮短載入時間,您還必須最佳化CSS發送過程。
內嵌較小的JavaScript
如果外部指令碼較小,您可以直接將它們添加到HTML文檔。通過這種方式內嵌較小檔案可讓瀏覽器繼續呈現網頁。例如,如果HTML文檔如下所示:
<html> <head> <scripttype="text/javascript"src="small.js"></script> </head> <body> <div> Hello, world! </div> </body></html>
資源small.js如下所示:
/* contents of a small JavaScript file */
那麼,您即可按如下這樣內嵌指令碼:
<html> <head> <scripttype="text/javascript"> /* contents of a small JavaScript file */ </script> </head> <body> <div> Hello, world! </div> </body></html>
這樣,您就可以將small.js內嵌在HTML文檔中,從而消除對它的外部請求。
消極式載入JavaScript
為防止JavaScript阻止網頁載入,建議您在載入JavaScript時使用HTML非同步屬性。例如:
<script async src="my.js">
如果您的JavaScript資源使用的是document.write,則使用非同步載入就會不安全。我們建議您重寫使用document.write的指令碼,以改用其他技術。
此外,非同步載入JavaScript時,如果您的網頁載入互相依賴的指令碼,請務必謹慎,以確保您的應用以合適的依賴順序載入指令碼。
常見問題集
-
如果我使用的是JavaScript庫(例如jQuery),該怎麼做?
-
很多JavaScript庫(例如jQuery)都可用來增強網頁,從而為網頁增添額外的互動性、動畫和其他效果。不過,這些行為大多可在首屏內容呈現後再安全添加。請考慮是否可以將此類JavaScript的執行和載入延遲到網頁載入後。
-
如果我使用JavaScript架構來構造網頁,該如何操作?
-
如果網頁內容由用戶端JavaScript構造,那麼您應考慮一下是否可以嵌入相關的JavaScript模組,從而避免產生額外的網路往返過程。同樣,利用伺服器端呈現可顯著提升首次網頁載入的效果,方式如下:在伺服器上呈現JS模板,並將結果內嵌到HTML,然後在應用載入後使用用戶端模板。
怎通過 JavaScript 刪除 disabled 值
JavaScript:
<input type="text" disabled="disabled" id="txt1" value="11" />11
<script type="text/javascript" language="JavaScript">
document.getElementById('txt1').disabled=false;
</script>
javascript中阻止form提交資料問題
<form name="form1" action="myresult.jsp" onsubmit="return checkNum();">