JQuery入門總結(jié)（二）【選擇器、方法應(yīng)用】

1、$(document).ready(function(){

})
dom加載完成后觸發(fā)
window.onload
只能注冊一個方法
頁面所有內(nèi)容加載完成后觸發(fā)（圖片，css，js都加
縮寫
$(function(){
})
2、jQuery對象(包裝集)  dom對象
var div = document.getElementById("id") dom對象
var div = $(".class") 包裝集,對dom對象包裝，返回的是很多個dom對象
3、jQeury選擇器
$("#id")
$(".class")
$("input")
復合選擇器 $("#id,.class,input")
4 $(who).when(what)  $("#btn").click(function(){})
5、層次選擇器
$("div p") 包含選擇器 div中所有的p 子元素 子子元素..
$("div > p")  子后代選擇器 div中直接子后代
6、常用的方法html()  text()  val()  attr()  css() removeAttr()
addClass()   removeClass()  toggleClass()
7、簡單選擇器
:first 選取第一個元素   $("div:first") 
:last 選取最后一個元素
:not(選擇器) 選取不滿足“選擇器”條件的元素$("div:not(#id)")
:even、:odd，選取索引是奇數(shù)、偶數(shù)的元素
:eq(索引序號)、:gt(索引序號)、:lt(索引序號) 
8、設(shè)置樣式
addClass("myclass")(不影響其他樣式)
removeClass("myclass")移除樣式
toggleClass("myclass")如果存在樣式則去掉樣式，如果沒有樣式則添加樣式
hasClass("myclass")判斷是否存在樣式
9、鏈式編程 
$(this).css("background-color", "red").siblings().css("background-color", "white");
10、屬性過濾選擇器
$("div[id]")選取有id屬性
$("div[title=test]")選取title屬性為test的元素
$("div[title!=test]")選取title屬性不為test的元素
etc....查看幫助
11、表單選擇器
$(表單有的input標簽
$(":input")匹配所有 input, textarea, select 和 button 元素
$(":text")匹配所有 匹配所有的單行文本框
$(":checkbox")匹配所有復選框
etc.....查看幫助
11.5、表單屬性選擇器
$(":checkbox:checked")  所有選中的checkbox
12、動態(tài)創(chuàng)建Dom
var link = $("<a >百度</a>");動態(tài)創(chuàng)建jquery對象，只是在內(nèi)存中
$("div:first").append(link);  把動態(tài)創(chuàng)建的jquery對象，加到第一個div中
動態(tài)創(chuàng)建dom注意：
var some = $("<div id='d1'>a<p></p>c</div>")
$("#d1").text() 不可以，因為$("#d1")在窗體上去找對象了，但是some現(xiàn)在在內(nèi)存中，還沒加載到窗體
當把動態(tài)創(chuàng)建的節(jié)點添加到窗體前，不能通過$("#d1")訪問到它
必須先把some追加到窗體
$("div:first").append(some);
才可以通過$("#d1") 中找到它
append   把link元素追加到哪$("div:first").append(link);  
appendTo  link.appendTo("div:first")
在結(jié)束標簽之前添加元素 加子節(jié)點
直接把元素移動過去，并且包含所有事件
prepend
prependTo
在開始標簽之后添加元素  加子節(jié)點
after
afterTo
在結(jié)束標簽外添加元素  加兄弟節(jié)點
before
beforeTo
在開始標簽前添加元素 加兄弟節(jié)點
13、刪除節(jié)點
remove()  刪除當前節(jié)點
empty() 清空當前節(jié)點之間的內(nèi)容，節(jié)點保留
14、*替換節(jié)點
$(“br”).replaceWith(“<hr/>”);  
15、*包裹節(jié)點
wrap()將所有元素逐個用指定標簽包裹
16、綁定事件
綁定事件 $("#id").bind("click",function(){})
解除綁定 $("#id").unbind("click",function(){})
讓事件只執(zhí)行一次 $("#id").one("click",function(){})
合成事件hover  toggle
hover(enterfn,leavefn)  當鼠標放上時執(zhí)行enterfn，當鼠標離開時執(zhí)行l(wèi)eavefn  封裝mouseover，mouseout
toggle(fn1,fn2) 當鼠標第一次點擊時執(zhí)行fn1，第二次點擊執(zhí)行fn2，以后依次執(zhí)行  封裝click
17、事件冒泡
mouseover、mouseenter   mouseover會事件冒泡，mouseenter不會
mouseout、mouseleavemouseleave會阻止事件冒泡

阻止事件冒泡 
$("#d1").click(function(e){ e.stopPropagation();})
18、*事件參數(shù)
pageX、pageY
target 獲得觸發(fā)事件的元素(事件冒泡的起始) 相當于event.srcElement
altKey、shiftKey、ctrlKey
當鍵盤按下 keyCode 鍵盤碼、which  ascii碼
當鼠標按下的時候which可以獲取鼠標左右鍵(1,3)
19、動畫
show()、hide()
toggle()  切換顯示隱藏
slideDown、slideUp、 fadeOut、fadeIn
animate 復雜動畫