jQ原型上的核心方法和屬性:
1、jquery 獲取jQ版本號(hào)
2异逐、selector 實(shí)例默認(rèn)的選擇器取值
3、length 實(shí)例默認(rèn)的長(zhǎng)度
4、toArray 把實(shí)例轉(zhuǎn)換為數(shù)組返回
5酝掩、get 獲取指定下標(biāo)的元素,獲取的是原生DOM
6眷柔、eq 獲取指定下標(biāo)的元素期虾,獲取的是jQuery類型的實(shí)例對(duì)象
7、first 獲取實(shí)例中的第一個(gè)元素驯嘱,是jQuery類型的實(shí)例對(duì)象
8镶苞、last 獲取實(shí)例中的最后一個(gè)元素,是jQuery類型的實(shí)例對(duì)象
9鞠评、splice 按照指定下標(biāo)指定數(shù)量刪除元素茂蚓,也可以替換刪除的元素
11、push 給實(shí)例添加新元素
12、sort 對(duì)實(shí)例中的元素進(jìn)行排序
13聋涨、each 遍歷實(shí)例晾浴,把遍歷到的數(shù)據(jù)傳給回調(diào)使用
14、map 遍歷實(shí)例牍白,把遍歷到的數(shù)據(jù)傳給回調(diào)使用脊凰,然后把回調(diào)的返回值收集起來組成一個(gè)新的數(shù)組返回
- 屬性和方法的測(cè)試函數(shù)
console.log($().jquery);//2.0.0
console.log($().selector);//''
console.log($().length);//0
//4、toArray 把實(shí)例轉(zhuǎn)換為數(shù)組返回
$(function(){
console.log($('div'));//init {0: div, 1: div, 2: div, length: 3}
console.log($("div").toArray());//Array:(3)
})
- jq中封裝
jquery:'2.0.0' ,
selector:"",
length:0,
toArray:function(){
return [].slice.call(this)
},
- 5.get 獲取指定下標(biāo)的元素茂腥,獲取的是原生DOM
$(function(){
console.log($('div'));//init {0: div, 1: div, 2: div, length: 3}
console.log($('div').get()); //[div, div, div] console.log($('div').get(1));//<div>div2</div>
console.log($('div').get(-1));//<div>div3</div>
console.log($('div').get("ads"));//undefined
})
get:function(index){
//1.沒有傳入?yún)?shù),返回?cái)?shù)組
if(arguments.length==0){
return this.toArray();
}
//2.傳入一個(gè)正數(shù)
if(index>0){
return this[index];
}
//3.傳入一個(gè)負(fù)數(shù)
if(index<0){
return this[this.length+index]
}
},
返回的是數(shù)組
6.eq 獲取指定下標(biāo)的元素狸涌,獲取的是jQuery類型的實(shí)例對(duì)象
$(function(){
console.log($("div"));
//如果沒有傳遞參數(shù),會(huì)返回一個(gè)空的jq實(shí)例
console.log($('div').eq());
//會(huì)將指定索引的元素包裝為一個(gè)jQ實(shí)例之后返回
console.log($('div').eq(1));
console.log($('div').eq(-2));
console.log($('div').eq('abc'));
})
- 1.如果沒有傳遞參數(shù),會(huì)返回一個(gè)空的jq實(shí)例
- 2.會(huì)將指定索引的元素包裝為一個(gè)jQ實(shí)例之后返回
eq:function(index){
//1.沒有傳遞參數(shù), 返回所有實(shí)例
if(arguments.length==0){
return this;
}
//傳入index的正負(fù)情況和get方法一樣,只是eq返回的是實(shí)例,而get返回的是數(shù)組,只需要用$()包裝成實(shí)例即可
return $(this.get(index));
},
- 返回的都是jq實(shí)例
- 沒有傳遞參數(shù), 返回所有實(shí)例
- 傳入index的正負(fù)情況和get方法一樣,只是eq返回的是實(shí)例,而get返回的是數(shù)組,只需要用$()包裝成實(shí)例即可
- 7.first 獲取實(shí)例中的第一個(gè)元素,是jQuery類型的實(shí)例對(duì)象
$(function () {
console.log($("div").first());
});
- 8.last 獲取實(shí)例中的最后一個(gè)元素最岗,是jQuery類型的實(shí)例對(duì)象
$(function () {
console.log($("div").last());
});
$(function () {
var oBtn = document.createElement("button");
var temp = $("div");
console.log(temp);//打印出3個(gè)div和 1個(gè)button(沒添加的時(shí)候沒有) 都是jq類型的實(shí)例對(duì)象
temp.push(oBtn);
console.log(temp);//打印出3個(gè)div和 1個(gè)button 都是jq類型的實(shí)例對(duì)象
});
- 11杈抢、push 給實(shí)例添加新元素
$(function () {
var oBtn = document.createElement("button");
var temp = $("div");
console.log(temp); //打印出3個(gè)div 都是jq類型的實(shí)例對(duì)象
temp.push(oBtn);
console.log(temp);//打印出3個(gè)div和 1個(gè)button 都是jq類型的實(shí)例對(duì)象
});
- 上面幾個(gè)方法的jQuery結(jié)構(gòu)
first:function(){
return this.eq(0);
},
last:function(){
return this.eq(-1);
},
sort:[].sort,
splice:[].splice,
push:[].push,
slice:[].slice,