首頁  >  文章  >  web前端  >  JavaScript程式開發之JS程式碼放置的位置_javascript技巧

JavaScript程式開發之JS程式碼放置的位置_javascript技巧

WBOY
WBOY原創
2016-05-16 15:19:491848瀏覽

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 解決方法 :

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