JavaScript程式開發之JS程式碼放置的位置_javascript技巧
JavaScript在頁面中使用，那麼這些JS程式碼該放在什麼位置呢？下面來看一下。
一般來說有兩種方式，寫在介面上和使用.js檔。
1.1介面上的Head部分
可以直接放在head標籤內，如下碼
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>testPage</title> <script type="text/javascript"> //your js code </script> </head> <body> <form id="form1" runat="server"> <div> </div> </form> </body> </html>
1.2介面上的body部分
一般都是直接放在body部分的，如下
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>testPage</title> </head> <body> <form id="form1" runat="server"> <div> </div> </form> <script type="text/javascript"> //your js code </script> </body> </html>
放在head和body沒有什麼差別，一般程式碼量不多的時候，而且只有目前頁面使用這些js，那就直接寫在介面上吧。
2、JS檔
對於那些複雜的，而且程式碼量很多的JS，最好放在專門的一個.js檔案裡，然後在頁面上按照js檔案的相對路徑引用進來。
這樣的好處是，可以防止很多重複的js程式碼。可以將一些公用的js方法放在外部js檔案裡。
例如，一般使用visual studio 2010新建的asp.net工程中都帶的有jquery-1.4.1.js文件，我們看怎麼使用這個js文件。
例如頁面的文件結構如圖，
要在MyJSFrm.aspx中使用這個js檔案就這樣引入。
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>testPage</title> </head> <body> <form id="form1" runat="server"> <div> </div> </form> <script type="text/javascript" src="/Scripts/jquery-1.4.1.js"></script> <script type="text/javascript"> //your js code </script> </body> </html>
總之，別忘了使用相對目錄，如果目前頁面檔案的目錄層級比較深，那就使用../自己算目錄的層級吧。
js 三種位置的差異：
head :
-- 在呼叫腳本時，已經完成載入了
--
body ：
-- 在生成頁面的時候就已經完成載入了
--
外部js ：
-- 引用外部js 注意：外部js不能包含<script></script>這兩個標籤
-- 主要是為了節省當多個頁面重複呼叫相同js函數時，可以節省在每個頁面中嵌入相同的js程式碼；
瀏覽器不辨識 js 解決方法 ：
熱AI工具
Undresser.AI Undress
人工智慧驅動的應用程序，用於創建逼真的裸體照片
AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。
Undress AI Tool
免費脫衣圖片
Clothoff.io
AI脫衣器
AI Hentai Generator
免費產生 AI 無盡。
熱門文章
熱工具
記事本++7.3.1
好用且免費的程式碼編輯器
SublimeText3漢化版
中文版，非常好用
禪工作室 13.0.1
強大的PHP整合開發環境
Dreamweaver CS6
視覺化網頁開發工具
SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)
熱門話題
在JavaScript中替換字符串字符
Mar 11, 2025 am 12:07 AM
JavaScript字符串替換方法詳解及常見問題解答 本文將探討兩種在JavaScript中替換字符串字符的方法：在JavaScript代碼內部替換和在網頁HTML內部替換。 在JavaScript代碼內部替換字符串 最直接的方法是使用replace()方法： str = str.replace("find","replace"); 該方法僅替換第一個匹配項。要替換所有匹配項，需使用正則表達式並添加全局標誌g： str = str.replace(/fi
如何在瀏覽器中優化JavaScript代碼以進行性能？
Mar 18, 2025 pm 03:14 PM
本文討論了在瀏覽器中優化JavaScript性能的策略，重點是減少執行時間並最大程度地減少對頁面負載速度的影響。
如何使用瀏覽器開發人員工具有效調試JavaScript代碼？
Mar 18, 2025 pm 03:16 PM
本文討論了使用瀏覽器開發人員工具的有效JavaScript調試，專注於設置斷點，使用控制台和分析性能。
立即提高jQuery性能的10種方法
Mar 11, 2025 am 12:15 AM
本文概述了十個簡單的步驟，可以顯著提高腳本的性能。 這些技術很簡單，適用於所有技能水平。 保持更新：使用bundler（例如vite）的npm等軟件包經理來確保
使用Passport與semelize和MySQL
Mar 11, 2025 am 11:04 AM
續集是一個基於承諾的node.js orm。它可以與PostgreSQL，MySQL，MariadB，Sqlite和MSSQL一起使用。在本教程中，我們將為Web應用程序的用戶實施身份驗證。我們將使用Passport，Passport，Midderw的流行身份驗證
如何構建簡單的jQuery滑塊
Mar 11, 2025 am 12:19 AM
本文將引導您使用jQuery庫創建一個簡單的圖片輪播。我們將使用bxSlider庫，它基於jQuery構建，並提供許多配置選項來設置輪播。 如今，圖片輪播已成為網站必備功能——一圖胜千言！ 決定使用圖片輪播後，下一個問題是如何創建它。首先，您需要收集高質量、高分辨率的圖片。 接下來，您需要使用HTML和一些JavaScript代碼來創建圖片輪播。網絡上有很多庫可以幫助您以不同的方式創建輪播。我們將使用開源的bxSlider庫。 bxSlider庫支持響應式設計，因此使用此庫構建的輪播可以適應任何
