jQuery是一套跨瀏覽器的JavaScript函式庫，簡化HTML與JavaScript之間的操作。

畫面載入完成後執行
window.onload = function() { 
    alert( "Hello jQuery" ); 
};
立即執行
$( document ).ready(function() {
 
    // Your code here.
 
});

預設避免與其他框架衝突，提供不同方式執行:

• $():最常用
• jQuery()
• window.jQuery()

基本Selectors

<div id="title" class="title-content"></div>
#代表id
$("#title")

.代表class
$(".title-content")

代表全部
$("*")

代表div tag
$("div")

Conbined Selectors

<div id="title" class="title-content"></div>
#代表div的id=title
$("div#title")

.代表div的class是title-content的
$("div.title-content")

代表多個共用
$("div.class,h1,h2")

Hierarchy Selectors階層式選擇器概念跟CSS的一樣

$("table td")
$("tr > td")
$("label + input")

Index Selectors

$("a:first")
$("a:last")
$("a:lt(2)") index<2
$("a:eq(2)") index=2

Visibility Selectors

<div id="title" class="title-content"></div>
$("div:visible")
$("div:hidden")

還有很多Selector方法可以擷取到Client端的任何區塊的資料後，我們就可以拿來做事件的判斷

• 控制內容 $("div").replaceWith("<div>replace</div>")、$().empty();、$().remove();、$().appendTo();
• 處理html Attribute $().attr()、 removeAttr()
• 控制CSS $().css(); 、$().addClass() removeClass() toggleClass()
• 控制AJAX $.get()、 $.post()、$.ajax()

學習資源

jQuery.org :https://learn.jquery.com/code-organization/concepts/
w3c :http://www.w3schools.com/jquery/