1 jQuery 如何獲取元素
- jQuery獲取選擇器對(duì)應(yīng)的元素對(duì)象,返回可操作對(duì)象.
- 利用操作對(duì)象的原型對(duì)象上的api進(jìn)行操作元素對(duì)象.
1.1 使用CSS的選擇器模式獲得元素.
$('selector')
1.2 使用自定義模式獲得元素
$('a:first') //選擇網(wǎng)頁(yè)中第一個(gè)a元素
$('tr:odd') //選擇表格的奇數(shù)行
$('#myForm :input') // 選擇表單中的input元素
$('div:visible') //選擇可見的div元素
$('div:gt(2)') // 選擇所有的div元素,除了前三個(gè)
$('div:animated') // 選擇當(dāng)前處于動(dòng)畫狀態(tài)的div元素
1.3 使用內(nèi)置過濾器,獲得元素
$('div').has('p'); // 選擇包含p元素的div元素
$('div').not('.myClass'); //選擇class不等于myClass的div元素
$('div').filter('.myClass'); //選擇class等于myClass的div元素
$('div').first(); //選擇第1個(gè)div元素
$('div').eq(5); //選擇第6個(gè)div元素
1.4 結(jié)果集二次選擇
$('div').next('p'); //選擇div元素后面的第一個(gè)p元素
$('div').parent(); //選擇div元素的父元素
$('div').closest('form'); //選擇離div最近的那個(gè)form父元素
$('div').children(); //選擇div的所有子元素
$('div').siblings(); //選擇div的同級(jí)元素
2 jQuery 的鏈?zhǔn)讲僮魇窃鯓拥?/h1>
- 為了獲得鏈?zhǔn)綄?duì)象,將函數(shù)中的結(jié)果集再次傳入$(result)中二次封裝.
- 這樣新的jQuery對(duì)象就可以進(jìn)行鏈?zhǔn)讲僮?
2.1 使用end(),讓結(jié)果集后退到上一次的jQuery對(duì)象.
3 jQuery 如何創(chuàng)建元素
$(),可以傳入數(shù)組,選擇器,以及HTML代碼創(chuàng)建對(duì)象.
- 這里使用了重載模式
3.1 jQuery 創(chuàng)建對(duì)象
$('<div>1</div>')
4 jQuery 如何移動(dòng)元素
-
.insertAfter()和.after()
:在現(xiàn)存元素的外部,從后面插入元素 -
.insertBefore()和.before()
:在現(xiàn)存元素的外部,從前面插入元素 -
.appendTo()和.append()
:在現(xiàn)存元素的內(nèi)部徒河,從后面插入元素 -
.prependTo()和.prepend()
:在現(xiàn)存元素的內(nèi)部,從前面插入元素
//以下效果相同
$("<span>Hello World!</span>").appendTo(".p1");
$(".p2").append(" <b>插入文本</b>.");
5取值與賦值統(tǒng)一api.
- 使用了可讀即可寫
.html() //取出或設(shè)置html內(nèi)容
.text() //取出或設(shè)置text內(nèi)容
.attr() //取出或設(shè)置某個(gè)屬性的值
.width() //取出或設(shè)置某個(gè)元素的寬度
.height() //取出或設(shè)置某個(gè)元素的高度
.val() //取出某個(gè)表單元素的值