最近用到瞭jquery 就自己學習瞭一下，這裡是入門的時候自己做的一些筆記（參考3wschool）。還有一些自己寫的簡單的練習代碼
一、三種不同的加載jquery文件的方法
1.本地文件（要提前將js文件下載下來）加載<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
一般有兩份 jQuery 拷貝可供下載，一是縮小版（由 Google Closure Compiler），另一個是未壓縮版（供 debugging 或 reading）
可以到http://download.csdn.net/source/3561704下載
2.加載Google 的 CDN<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
3.加載Microsoft 的 CDN<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.min.js"></script>
二、jquery的使用（推薦格式）
1.把所有 jQuery 代碼置於事件處理函數中
2.把所有事件處理函數置於文檔就緒事件處理器中
3.若文件很大把 jQuery 代碼置於單獨的 .js 文件中
如下一段代碼（將這段代碼保存一個html後綴名的文件就可以看到他的效果瞭）：
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){ –文檔就緒事件處理器，防止文檔在完全加載（就緒）之前運行 jQuery 代碼。這個是以後都要用到的
$("p").click(function(){ –事件處理函數，根據自己的需要去調用相應的函數
$(this).hide(); –具體要執行的動作
});
});
</script>
</head>
<body>
<p>If you click on me, I will disappear.</p>
</body>
</html>
三、jquery使用的語法
基礎語法是：$(selector).action()
1.美元符號定義 jQuery
2.選擇符（selector）“查詢”和“查找” HTML 元素
3.jQuery action() 執行對元素的操作
例如:$(this).hide() – 隱藏當前元素
四、jquery的選擇器:$()
1.元素選擇器
2.屬性選擇器
3.css選擇器
五、jquery的事件
1.jQuery 事件處理函數是 jQuery 中的核心函數。事件處理函數是當 HTML中發生事件時自動被調用的函數
2.事件添加的不同，如上面的例子對<p>元素的單擊事件的調用
3.記著要特別註意將事件處理放在文檔就緒事件處理器中
然後自己寫瞭一些練習的代碼，都是最基礎的。
Html代碼
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<title>Selector</title>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<link href="select.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
$(document).ready(function(){
<!–選擇屬性class為one的所有的p元素–>
$("p.one").click(function(){
<!–選擇當前元素–>
$(this).hide(3000);
});
<!– 選擇所有的p元素,也包括class=one的隻是按順序先執行瞭上面那個方法,若將這個方法放到上面那個方法前則會先執行這個方法–>
$("p").click(function(){
$(this).hide("slow");
});
<!–選擇id=two的第一個元素（註意下面有兩個id=two的元素）–>
$("p#two").click(function(){
$(this).slideToggle("slow");
});
<!–選擇input類型為button的元素,後面的:first指的是第一個button按鈕–>
<!–first（第一個） last（最後一個） even（所有偶數） odd（所有奇數）–>
$(":button:first").click(function() {
<!–選擇全部的元素–>
$("*").hide();
});
});
</script>
</head>
<body>
<p> 第一個p。點擊我，我就消失瞭</p>
<p class="one">第二個p。 點擊我，我也消失</p>
<p id="two"> 第三個p。點擊我，我會消失然後再重現</p>
<span id="two">點擊我，看看我會不會消失然後重現—不會</span>
<br>
<input type=button value="點擊我，全部的都會消失"></input>
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<title>Selector</title>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<link href="select.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
$(document).ready(function(){
<!–選擇屬性class為one的所有的p元素–>
$("p.one").click(function(){
<!–選擇當前元素–>
$(this).hide(3000);
});
<!– 選擇所有的p元素,也包括class=one的隻是按順序先執行瞭上面那個方法,若將這個方法放到上面那個方法前則會先執行這個方法–>
$("p").click(function(){
$(this).hide("slow");
});
<!–選擇id=two的第一個元素（註意下面有兩個id=two的元素）–>
$("p#two").click(function(){
$(this).slideToggle("slow");
});
<!–選擇input類型為button的元素,後面的:first指的是第一個button按鈕–>
<!–first（第一個） last（最後一個） even（所有偶數） odd（所有奇數）–>
$(":button:first").click(function() {
<!–選擇全部的元素–>
$("*").hide();
});
});
</script>
</head>
<body>
<p> 第一個p。點擊我，我就消失瞭</p>
<p class="one">第二個p。 點擊我，我也消失</p>
<p id="two"> 第三個p。點擊我，我會消失然後再重現</p>
<span id="two">點擊我，看看我會不會消失然後重現—不會</span>
<br>
<input type=button value="點擊我，全部的都會消失"></input>
</body>
</html>
用到的css文件
Html代碼
<PRE class=css name="code">body {
background-color:#778866;
width:1000px;
height:800px;
}
p {
font-family:"Arial Black";
font-size:12px;
}
p.one {
font-family:"Book Antiqua";
font-size:20px;
}
#two {
font-family:"Arial Rounded MT Bold";
font-size:30px;
}
</PRE>