JQuery基礎

1、概念
jQuery是一套跨瀏覽器的JavaScript庫，簡化HTML與JavaScript之間的操做。

$(document).ready(function(){寫JQuery語句});
JS寫在body中的時候全部語句寫在上面裏

2、選擇器
一、基本選擇器
id:$("#div1")
class:$(".div1")
標籤:$("p")
並列:$("#div1,#div2") 用,隔開
後代:$("#div1 p") 用空格隔開
二、過濾選擇器
首個:$("#div1:first")
尾個:$("#div1:last")
任意一個:$("#div1:eq(索引)")或$("#div1").eq(索引)
大於:$("#div1:gt(索引)")
小於:$("#div1:lt(索引)")
排除:$("#div1:not(選擇器)")
奇數索引:$("#div1:odd")
偶數索引:$("#div1:even")

屬性名過濾:$(".div[aaa]")
屬性值過濾:$(".div[aaa=2]")或$(".div[aaa!=2]")

內容過濾:
文字 $("#div1:contains("字符串")")
子元素:$("#div1:has("選擇器")")

3、事件
一、基本事件
JS中的事件去掉on
二、複合事件
hover(function(){},function(){}); 至關於移入和移除事件
toggle(function(){},function(){},function(){},...);點擊時依次循環
三、事件冒泡
JQuery中執行完本次事件後，若是父級有事件，會接着執行父級事件
阻止事件冒泡：return false;

4、DOM操做
一、操做屬性
獲取屬性 var s=$(this).attr("屬性名");
設置屬性 $(this).attr("屬性名","屬性值");
刪除屬性 $(this).removeAttr("屬性名");
二、操做樣式
(1)操做內聯樣式
設置樣式 $(this).css("屬性名","屬性值").css("屬性名","屬性值")...;
獲取樣式 $(this).css("屬性名") 或者 $(this).offset

//返回偏移座標：
$(selector).offset()
//設置偏移座標：
$(selector).offset({top:value,left:value})
//使用函數設置偏移座標：
$(selector).offset(function(index,currentoffset))

(2)操做樣式表的class
添加class $(this).addclass("class名");
移除clsss $(this).removeclass("class名");
添加與移除交替 $(this).toggleclass("class名");
三、操做相關元素
(1)查找
父輩parent() 前輩parents(選擇器)
子級children() 後代find(選擇器)
哥 prev() prevAll(選擇器)
弟 next() nextAll(選擇器)
(2)操做
複製 clone()
新建 $("HTML字符串") 或者 var s="HTML字符串";
移除內部所有元素 empty()
移除元素自己 remove()
添加到內部 appen(JQuery對象)
添加到平級下面 after()
添加到平級上面 before()

四、操做內容
(1)表單元素
取值var ss=$("選擇器").val();
賦值：$("選擇器").val("值");
(2)非表單元素
取值var ss=$("選擇器").html(); var ss=$("選擇器").text();
賦值$("選擇器").html("內容")； $("選擇器").text("內容");
五、將來元素
(1) 對象.live("事件名",function(){})
(2) 動態添加到網頁中的對象的事件不會執行，當寫上將來元素才執行。