目錄
- jQuery 如何獲取元素
- jQuery 的鏈?zhǔn)讲僮?/li>
- jQuery 如何創(chuàng)建元素
- jQuery 如何移動(dòng)元素
- jQuery 如何修改元素的屬性
一、獲取正確的元素
1硼被、 得到一個(gè)操作符合條件的數(shù)組的api
表達(dá)式可以是css選擇器：
$(document) // 選擇整個(gè)文檔為對(duì)象
$('#myID') // 選擇ID為myId的網(wǎng)頁(yè)元素
也可以是jQuery特有的表達(dá)式：
$('div:first') //選擇網(wǎng)頁(yè)中第一個(gè)div元素
$('#myForn:input') //先擇表單中的input元素
$('tr:odd') //選擇表格的奇數(shù)行
$('div:gt(3)') //選擇所有的div元素惶岭，除了前4個(gè)
2寿弱、將數(shù)組變小，找到要操作的正確元素
jQuery提供了大量的過(guò)濾器：
$('div').eq(2) //選擇第3個(gè)div元素
$('div').has('p') //選擇包含p元素的div元素
$('div').filter('.myClass') //選擇class為myClass的div元素
$('div').not('#myID') //選擇ID不為myID的div元素
$('div').first() //選擇第一個(gè)div元素
二按灶、jQuery的鏈?zhǔn)讲僮?/h2>
jQuery的特別之處在于症革，每一步操作之后都是return一個(gè)可以繼續(xù)操作的api，使得操作可以連續(xù)鸯旁，呈鏈?zhǔn)讲僮鳌?br>
如：$('#test).find('.child').addClass('red')
把它拆開(kāi)來(lái)如下：
$('#test') //找到ID為text的元素
.find('.child') //找到其中class為child的元素
.addClass('red') //為所有選定的元素加上class
jQuery還提供了end()方法噪矛，使得結(jié)果集可以后退一步量蕊。
三、創(chuàng)建元素
創(chuàng)建新元素的方法非常簡(jiǎn)單艇挨，只要把新元素直接傳入jQuery的構(gòu)造函數(shù)就行了残炮。如下：
$('<div class="text">text</div>')
原理是使用了重載的設(shè)計(jì)模式，對(duì)傳入的參數(shù)進(jìn)行了辨別缩滨。
四势就、移動(dòng)元素
1、把div插入到p后面：
$('div').insertAfter($('p')) //返回操作div的jQuery元素
$('p').after($('div')) //返回操作p的jQuery元素
2脉漏、把div插入到p前面：
$('div').insertBefore($('p')) //返回操作div的jQuery元素
$('p').before($('div')) //返回操作p的jQuery元素
3苞冯、把p插入到div中，作為div的最后一個(gè)子元素
$('p').appendTo($('p')) //返回操作div的jQuery元素
$('div').append($('p')) //返回操作p的jQuery元素
```pre
4鸠删、把p插入到div中抱完，作為div的第一個(gè)子元素
```js
$('p').preppendTo($('p')) //返回操作div的jQuery元素
$('div').preppend($('p')) //返回操作p的jQuery元素
五、修改元素的屬性
jQuery中的屬性讀取與修改刃泡，都是同一個(gè)函數(shù)巧娱，應(yīng)用了getter/setter設(shè)計(jì)模式。
當(dāng)函數(shù)傳入?yún)?shù)時(shí)烘贴，表示是修改屬性禁添，當(dāng)不傳參數(shù)時(shí)，是讀屬性桨踪。
常見(jiàn)的取值與賦值函數(shù)如下：
.html() // 取出或設(shè)置html內(nèi)容
.text() //取出或設(shè)置text內(nèi)容
.attr() //取出或設(shè)置某個(gè)屬性的值
.width() //取出或設(shè)置某個(gè)元素的寬度
.heigth() //取出或設(shè)置某個(gè)元素的高度
.val() //取出某個(gè)表單元素的值
需要注意的是老翘，如果結(jié)果集包含多個(gè)元素，那么賦值的時(shí)候锻离，將對(duì)其中所有的元素賦值铺峭；取值的時(shí)候，則是只取出第一個(gè)元素的值汽纠。.tetx()例外卫键，它取出所有元素的text內(nèi)容。
