1. jQuery 如何获取元素
操作网页元素,最常见的需求是取得它们的值,或者对它们进行赋值。
就是使用同一个函数,来完成取值(getter)和赋值(setter),即"取值器"与"赋值器"合一。到底是取值还是赋值,由函数的参数决定。
`$('h1').html();` //html()没有参数,表示取出h1的值
`$('h1').html('Hello');` //html()有参数Hello,表示对h1进行赋值
`[.html()]` 取出或设置html内容
`[.text()]` 取出或设置text内容
`[.attr()]` 取出或设置某个属性的值
`[.width()]` 取出或设置某个元素的宽度
`[.height()]`取出或设置某个元素的高度
`[.val()]` 取出某个表单元素的值
2. jQuery 的链式操作是怎样的
最终选中网页元素以后,可以对它进行一系列操作,并且所有操作可以连接在一起,以链条的形式写出来:
$('div').find('h3').eq(2).html('Hello');
- 分解开来,就是下面这样:
$('div') //找到div元素
.find('h3') //选择其中的h3元素
.eq(2) //选择第3个h3元素
.html('Hello'); //将它的内容改为Hello
- jQuery还提供了[.end()]方法:
$('div')
.find('h3')
.eq(2)
.html('Hello')
**.end() //退回到选中所有的h3元素的那一步**
.eq(0) //选中第一个h3元素
.html('World'); //将它的内容改为World
3. jQuery 如何创建元素
- 把新元素直接传入jQuery的构造函数就行:
$('<p>Hello</p>');
$('<li class="new">new list item</li>');
$('ul').append('<li>list item</li>');
4. jQuery 如何移动元素
- 第一种方法是使用
[.insertAfter()]
,把div元素移动p元素后面:
$('div').insertAfter($('p'));
第二种方法是使用[.after()]
,把p元素加到div元素前面:
$('p').after($('div'));
-
使用这种模式的操作方法,一共有四对:
[.insertAfter()]和[.after()]: 在现存元素的外部,从后面插入元素
[.insertBefore()]和[.before()]:在现存元素的外部,从前面插入元素
[.appendTo()]和[.append()]: 在现存元素的内部,从后面插入元素
[.prependTo()]和[.prepend()]: 在现存元素的内部,从前面插入元素
以上引自jQuery设计思想 - 阮一峰的网络日志 (ruanyifeng.com)
5. jQuery 如何修改元素的属性
jquery
中用attr()
方法来获取和设置元素属性,attr是attribute(属性)的缩写
$(selector).attr(attribute) //attribute 规定要获取其值的属性。
$(selector).attr(attribute,value)//attribute 规定属性的名称; value 规定属性的值。