如何加載外部JavaScript？
[英]How do I load external javascript?
問題描述
我正在瀏覽引導站點，他們在其中提到了要加載引導的此代碼段： http : //getbootstrap.com/getting-started/
本質上，引導javascript和JQuery緊接在body標簽之前。 這是加載任何外部javascript的推薦方法。
在任何情況下都必須在
head標簽中加載外部javascript嗎？ 因為，我看過很多這樣的例子。這個Google網頁具有在正文標簽https://developers.google.com/speed/docs/best-practices/payload?csw=1#MinifyHTML之前加載JavaScript的技術。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Bootstrap 101 Template</title> <!-- Bootstrap --> <link href="css/bootstrap.min.css" rel="stylesheet"> <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> <![endif]--> </head> <body> <h1>Hello, world!</h1> <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="js/bootstrap.min.js"></script> </body> </html>
3 個解決方案
解決方案1
1 2014-07-29 11:45:12
您可以在HTML文檔中放置任意數量的腳本。
腳本可以放在HTML的正文或標題部分，和/或兩者中。
通常，您會在網頁正文部分的底部看到腳本。 這樣可以減少顯示時間。
有時您會在頭部看到所有JavaScript函數。
無論如何，通過將所有代碼放在一個地方來分離HTML和JavaScript始終是一個好習慣。
將腳本放在body元素的底部是個好主意。 因為HTML加載不會被腳本加載阻止，所以可以提高頁面加載。
注意：您可以根據需要在頭或主體中放置一個外部腳本引用，該腳本的行為就像完全位於將引用放置在HTML文檔中的位置一樣。
解決方案2
1 已采納 2014-07-29 12:54:05
可以將<Script></Script>添加到文檔中的任何位置，但是通常的好習慣是在</head>關閉之前添加所有資源，例如JavaScript ， CSS ，Fonts和其他資源。
您會注意到；
1）所有meta標簽和文檔呈現標簽都在頂部
因為，瀏覽器首先正確呈現文檔，而meta標簽首先執行其工作。
2）在meta標簽之后添加CSS
因為，一旦呈現網頁，由於樣式在文檔中較早加載，它看起來可能很好。
3）腳本在標題中的樣式之后或</body>標簽關閉之前加載
通常的做法是在</head>關閉之前添加它們。 但是有些開發人員（我也這樣做）在</body>標記關閉之前添加了它們，以便所有樣式和HTML首先呈現，以便用戶可以首先看到樣式正確的頁面，最后可以加載繁重的腳本。 因此，頁面將快速加載，而其他升沉腳本將最后加載。
解決方案3
1 2014-07-30 05:46:39
通常，JavaScript文件是在頁面完全加載后加載的。.因為任何最終用戶都不想等待太長的時間才能使網頁顯示出來，所以請避免過多和冗長的請求，這些請求會延遲加載。 內聯jScript文件和小腳本包含在head標簽中。 Bootstrap還將js文件放在jquery.js之后的底部。
希望你理解我在說什么。
如何在 html 元素中加載外部 javascript function？
[英]How do I load an external javascript function in an html element?
如何在 React 中加載和運行外部 Javascript 代碼，這些代碼在應用程序中而不是在導入的文件中定義？
[英]How do I load and run external Javascript code in React that have their definitions in the application and not in the imported file?
如何動態加載位於外部服務器中的javascript文件？
[英]How do I load javascript file that's located in external server dynamically?
如何使用 eval(UrlFetchApp.fetch()) 在我的谷歌應用程序腳本中加載外部 javascript？
[英]How do I use eval(UrlFetchApp.fetch()) to load external javascript in my google apps script?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.
相關問題
如何更改外部javascript的加載順序
如何在 html 元素中加載外部 javascript function？
如何從外部文件加載Javascript？
如何檢查外部字體的負載
如何在頁面加載后加載谷歌地圖外部JavaScript？
如何在 React 中加載和運行外部 Javascript 代碼，這些代碼在應用程序中而不是在導入的文件中定義？
如何動態加載位於外部服務器中的javascript文件？
如何使用 eval(UrlFetchApp.fetch()) 在我的谷歌應用程序腳本中加載外部 javascript？
如何使該內聯JavaScript成為外部？
我如何鏈接到外部 <div> 用JavaScript？
相關標簽