入口函數(shù)
$(document).ready()相對(duì)于window.onload的優(yōu)勢(shì)
1.執(zhí)行時(shí)機(jī)
$(document).ready() //網(wǎng)頁中所有的DOM結(jié)構(gòu)繪制完畢后就執(zhí)行,可能DOM元素關(guān)聯(lián)的東西并沒有加載完
window.onload //必須等待網(wǎng)頁中所有的內(nèi)容加載完畢后(包括圖片)才能執(zhí)行
2.編寫個(gè)數(shù)
$(document).ready(function(){}) //可以同時(shí)編寫多個(gè),都執(zhí)行
window.onload//只能編寫一個(gè),如果同時(shí)編寫多個(gè),只會(huì)執(zhí)行最后一個(gè)
3.簡(jiǎn)寫
$(document).ready(function(){})
簡(jiǎn)寫:$(function(){})
window.onload//無簡(jiǎn)寫方式
方法
1.end() 重新定位到上次操作的元素
2.fadeTo() 方法將被選元素的不透明度逐漸地改變?yōu)橹付ǖ闹怠?參數(shù)1:speed 速度 可選
參數(shù)2:opacity 透明度 必選
$("#btn1").click(function () {
$("div").fadeTo(100,0.3)
});
3.unbind() 方法移除被選元素的事件處理程序你辣。
4.is() 根據(jù)選擇器筋讨、元素或 jQuery 對(duì)象來檢測(cè)匹配元素集合肥橙,如果這些元素中至少有一個(gè)元素匹配給定的參數(shù),則返回 true罕袋。
5.appendTo() 方法在被選元素的結(jié)尾(仍然在內(nèi)部)插入指定內(nèi)容。
提示:append()和 appendTo() 方法執(zhí)行的任務(wù)相同碍岔。不同之處在于:內(nèi)容和選擇器的位置浴讯,以及 append() 能夠使用函數(shù)來附加內(nèi)容。
語法: $(content).appendTo(selector)
content 必需蔼啦。規(guī)定要插入的內(nèi)容(可包含 HTML 標(biāo)簽)榆纽。
selector 必需。規(guī)定把內(nèi)容追加到哪個(gè)元素上捏肢。
6.children() 獲取子元素 只考慮子元素不考慮任何后代元素
7.next() 取得匹配元素后面緊鄰的一個(gè)兄弟元素
8.prev() 取得匹配元素前面緊鄰的一個(gè)兄弟元素
9.sibling 取得匹配元素的所有兄弟元素
10.find()方法獲得當(dāng)前元素集合中每個(gè)元素的后代掠河,通過選擇器、jQuery 對(duì)象或元素來篩選猛计。
11.finder()對(duì)自身集合進(jìn)行遍歷,篩選 find()是對(duì)后代元素操作
12.scrollTop()和scrollLeft() 分別獲取元素的滾動(dòng)條距頂端的距離和距左側(cè)的距離
// var scrollTop = $("p").scrollTop();//獲取元素的滾動(dòng)條距頂端的距離
// var scrollLeft = $("p").scrollLeft();//獲取元素的滾動(dòng)條距左側(cè)的距離
13.offset() 獲取元素在當(dāng)前視窗的相對(duì)便宜,其中返回的對(duì)象包含兩個(gè)屬性,即top和left.只對(duì)可見元素有效
var offset = $("p").offset();//獲取<p>元素的offset()
var left = offset.left //獲取左偏移
var top = offset.top //獲取上便宜
jQuery對(duì)象和DOM對(duì)象相互轉(zhuǎn)換
1.jQuery對(duì)象轉(zhuǎn)DOM對(duì)象
jQuery提供兩種方法將jQuery對(duì)象轉(zhuǎn)換成DOM對(duì)象
即[index]和get(index)
注意:jQuery對(duì)象是一個(gè)數(shù)組對(duì)象(對(duì)象集合)
var $cr = $("#cr"); //jQuery對(duì)象
var cr = $cr[0]; //DOM對(duì)象
var br = $cr.get(1) //DOM對(duì)象
2.DOM對(duì)象轉(zhuǎn)jQuery對(duì)象
只需要用$()把DOM對(duì)象包裝起來就可以獲得一個(gè)jQuery對(duì)象
var cr = document.getElementById("cr");//DOM對(duì)象
var $cr = $(cr); //jQuery對(duì)象
注意 :DOM對(duì)象才能使用DOM中的方法,jQuery不可以使用DOM中的方法
選擇器
+
$("prev+next") //選擇的是prev后的一個(gè)兄弟元素
$(".one+div") //選擇class為one元素的下一個(gè)div元素
~
$("prev~sibling") //選擇的是prev后面的所有Sibling元素
$(".two+div") //選擇class為two元素的后面的所有的div元素
選擇器中含有空格的注意事項(xiàng)
1.
var $t_a = $(".test :hidden");
//帶空格 在class屬性是test的元素中 選取其子元素是hidden類型的
以上代碼是選取class為"text"的元素里面的隱藏元素
2.
var $t_a = $(".test:hidden");//不帶空格的
以上代碼選取隱藏的class為"test"的元素.
結(jié)果不同原因:后代選擇器與過濾選擇器的不同
對(duì)于過濾選擇器加上空格來說,它獲取的事其子元素的過濾,所以代碼1獲取的事class為test的元素的子元素的隱藏元素
代碼2沒有空格,它獲取的事其自身元素的過濾,所以代碼2獲取的class為test的隱藏元素