1.行爲和動作的分離，注意和JavaScript源生的區別
//行爲和結構相分離被稱爲“不唐突的JavaScript”，而jquery的發明者哪裏讓該庫能幫助作者易於在頁面中實現這種分離。
//你會問但是沒有onclick特性的話，該如何設置按鈕的特性呢？
<button type="button" id="testButton" > Click Me </button>
/*
簡單多了，但現在你卻發現，按鈕什麼也幹不了。
不是把按鈕的行爲嵌入到按鈕的標記裏，而是將它轉移到頁面<head>節的腳本快裏，從而處於頁面<body/>節的範圍之外
*/
<script type="text/javascript">
window.onload = function(){
document.getElementById('testButton').onclick = makeItRed;
};
function makeItRed(){
document.getElementById('xyz').style.color = 'red';
}
</script>
/*
我們把腳本放在頁面的onload處理程序中，給按鈕元素的onclick特性指派makeItRed()函數。之所以將此腳本條件到onload處理程序中
是因爲在試圖操作按鈕元素之前，必須先確認按鈕元素的存在。
*/
2.$()對象
$()函數返回的JavaScript對象，它包含着與選擇器相匹配的DOM元素的數組。該對象擁有大量預定義的有用方法
能夠作用於該組元素。
//假定我們想讓帶有css類notLongForThisWord的所有<div>元素呈現淡出效果,同時返回相同的一組元素，提供下一個操作，還想添加css類removed到每個元素
$("div.notLongForThisWord").fadeOut().addClass("remoced");
這些jquery鏈可以無限延續。
即使選中對象組被發現爲非常複雜的JavaScript對象。
$("#someElement").html("i have addes");
或者
$("#someElement")[0].innerHTML = " i have addes";3.選擇器介紹
<ul class="myList">
<li><a href="http://jquery.com">jquery supports</a>
<ul>
<li><a href="css1">CSS1</a></li>
</ul>
</li>
</ul>
//父節點與直接子節點以右尖括號(>)隔開
p>a
//這個選擇器值匹配作爲<p>元素的子節點的鏈接。如果鏈接唄嵌套在更深一層，比如處在<p>之內的<span>之內，則不會鏈接被選中
實例的選擇器
ul.myList > li > a
//在開始鏈接(<a>)href特性值時，字符串http://的存在使得指向外部網站的鏈接與衆不同。
//可以利用這個選擇器
a[href^=http://] //這個選擇器匹配包含以http://開頭的值的所有鏈接。
//^表示匹配出現在某個值的開頭。大多數的正則表達式也採用這個。
//匹配擁有指定特性的元素，而不管特性的值是什麼，可用：
form[method]
//這個選擇器匹配擁有顯示method特性的任何<from>元素。
//爲了匹配具體的特性值，可使用如下語法形式:
input[type=text]
//這個選擇器匹配type特性值爲text的所有<input>元素。
div[title^=my]//以my開頭的所有<div>元素。
a[htef$=.pdf]//以pdf文件爲結束
//用來找到特性值的任何中包含某個字符串的元素：
a[href*=jquery.com]
//有時需要選擇元素，當且權當這個元素包含某個其它元素時才選它。
li:has(a)//這個選擇器匹配包含<a>元素的所有<li>元素。
//注意：jquery只支持一層嵌套
foo:not(bar:has(baz))
//比如：
foo:not(bar:has(baz:eq(2)))//不支持
//4.通過位置選擇
//也許你想要選擇頁面上的第一個鏈接、奇數或偶數的段落。或者每個鏈表的最後一項。
a:first //此格式的選擇器匹配頁面上的第一個<a>元素。
p:odd//奇數
p:even//偶數
li:last-child//選擇最後一個子節點
//舉例
<table id="language">
<thead>
<tr>
<th>type</th>
....
//所在行的第一個單元格
table #language tbody td:first-child//
或者
table #language tbody td:nth-child(1)//
//許多自定義jquery選擇器是和表單相關的，允許簡明地指定具體的元素類型或狀態。也可以組合。
//假定只想選擇已啓用的已選中複選框，可以使用
:checkbox:checked:enabled
//反轉篩選選擇器
//利用:not篩選器
input:not(:checkbox)
/*
篩選選擇器，通過對元素應用更高的選擇標準(就像前面的示列那樣)，縮小正在匹配的元素的集合；
查找選擇器，比如後代選擇器(空格符)、子節點選擇器(>)以及兄弟節點選擇器(+),則查找與與選擇元素具有某種關係的其他元素，而不是
通過把標準應用於匹配元素來限制匹配範圍。
*/
//5.生成html
//$函數不僅能夠選擇現有頁面元素，還能夠生成html
$("<div>Hello</div>")
或者
$("<div>")//等於$("<div></div>")和$("<div/>")
$("<div class='foo'>i have fooI</div><div>i domot</div>").filter(".foo").click(function(){
alert("i am foo");
}).end().appendTo("#someParentDiv");
/*
首先創建了兩個<div>元素，一個帶有類foo而另一個沒有。然後收窄選擇範圍，值選擇帶有類foo的<div>元素。
並給它綁定了事件處理程序。一旦點擊，就會觸發警告對話框。最後，使用end函數還原到包含兩個<div>元素的完整的集合
並把兩個元素追加到id爲someParebtDiv元素之後，從而把它綁定到dom樹。
*/
