JQuery 學習筆記01 JQuery初接觸

2024-05-06 14:10:08

字體：大中小

來源：轉載

供稿：網友

一、下載
官方網址是http://jquery.com/
官方下載地址：http://docs.jquery.com/Downloading_jQuery
里邊有當前版本和歷史版本的下載，可以下載下來部署在自己的服務器上
上面也有Google/Microsoft/jQuery的CDN(Content Delivery Network)地址，由于目前jQuery的廣泛使用，選擇CDN地址可以充分利用緩存和這些互聯網大佬們的帶寬和服務器資源。
官網上下載有兩種版本Compressed（Minified version）和Uncompressed（Source version）
前者體積小70k左右，還不到未壓縮版本的一半大小。
但是未壓縮版本更容易閱讀源代碼，以及調試
二、安裝
安裝jQuery非常簡單只需在HTML中引用你下載的那個js文件即可
比如 <script type="text/javascript" src="/jslibs/jquery.min.js"></script>
如果使用CDN 就直接引用<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
三、第一個程序
代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() { alert("hello"); })
</script>
</head>
<body>
</body>
</html>

刷新頁面后就可以執行了。
剛開始可能對$有點不適應，其實用不了多久就會習慣，并且喜歡它的簡潔。如果實在吃不消，“$”也可以用“jQuery”代替

代碼如下:$(function() { alert("hello"); })

相當于

代碼如下:$(document).ready(function() { alert("hello"); })

也基本相當于

代碼如下:document.onready = function() {alert("hello");}

也就是說當瀏覽器把文檔結構完全解析后，就可以執行下面的語句了。
與document.onload的區別在于，onload不但需要解析完文檔結構，還要等待所有需要加載的內容加載完畢（比如圖片等）
因為$(document).ready(fn)的頻繁使用，所以可以簡化為$(fn)

上一篇：JavaScript幾種形式的樹結構菜單

下一篇：javascript之通用簡單的table選項卡實現(二)