jquery详细方法大全Word格式文档下载.docx
《jquery详细方法大全Word格式文档下载.docx》由会员分享，可在线阅读，更多相关《jquery详细方法大全Word格式文档下载.docx（51页珍藏版）》请在冰豆网上搜索。
parent>
child
取得<
下的所有<
span>
子节点
div>
span"
）
返回Array<
:
first
选取所有<
元素中第一个<
元素
div:
first"
返回jQuery
last
元素中最后一个<
last"
not（Selector）
选取所有class不是mytest的<
not（.mytest）"
even
查找表格的偶数行，从0开始计数
tr:
even"
）
odd
查找表格的奇数行，从0开始计数
odd"
eq（index）
匹配一个给定索引值的元素，从0开始计数
eq
（1）"
gt（index）
匹配所有大于给定索引值的元素，从0开始计数
gt（0）"
lt（index）
匹配所有小于给定索引值的元素，从0开始计数
lt
（2）"
animated
选取当前正在执行动画的所有元素
animated"
contains（string）
选取所有文本内容包含“关键词”的<
contains（'
关键词'
）"
has
查找所有含有<
p>
子元素的<
父元素
has（p）"
empty
选取所有空<
的元素
empty"
visible
查找所有可见元素
visible"
[attribute=value]
选取文本输入框的input元素
input[type=text]"
[attribute!
=value]
选取所有不是hidden的input元素，注意，没有type属性的input也会被选取
input[type!
=hidden]"
[attribute^=value]
选取开头为mailto:
的所有a链接
a[href^='
mailto'
]"
[attribute$=value]
选取所有结尾为.jpg的img图片
img[src$='
.jpg'
表单选择器
input
查找所有的input元素（包括input,textarea,select和button）
input"
password
查找所有密码框
password"
text
查找所有单行文本框
text"
radio
查找所有单选按钮
radio"
checkbox
查找所有复选框
checkbox"
checked
查找所有选中的checkbox,radio
input:
checked"
selected
查找所有选中的选项元素
select:
selected"
属性
attr（key）attr（key,value）设置一个属性的值
HTML:
imgsrc="
test.jpg"
/>
jQuery:
img"
）.attr（"
src"
）;
Result:
test.jpg
removeAttr（key）
删除一个属性
）.removeAttr（"
[<
img/>
]
addClass（class）
追加指定的类名
Hello<
/p>
p"
）.addClass（"
selectedhighlight"
[<
pclass="
>
]如果要替换样式，用attr（）
removeClass（）
移除样式
Html:
red"
你最喜欢的是？
JQuery:
）.removeClass（"
p>
可以同时移除多个样式：
redbold"
或者全部移除样式：
）.removeClass（）;
toggleClass（）
如果节点存在该样式，则移除，不存在，则追加
）.toggleClass（"
blue"
hasClass（class）
判断节点是否存在该样式，返回布尔值
）.hasClass（"
该方法等价于：
）.is（"
.blue"
html（）
取得或设置文本内容
类似innerHTML（）
仅可用于html文档
返回String/jQuery
text（）
类似innerText（）
可以用于html和xml文档
val（）
取得或设置input文本框的值
Html：
inputtype="
id="
searchbox"
value="
搜索的内容…"
/>
）.focus（function（）{
if（this.val（）=="
）{this.val（"
）}
}）;
）.blur（function（）{
）{this.val（this.defaultValue）}
this.defaultValue表示input文本框的默认value
通过val（）还能做到将表单多选框,checkbox,radio事先选中：
）.val（["
check2"
"
check3"
]）;
radio2"
返回String/Array
节点匹配
each（callback）
为每一个匹配的元素执行一个函数
迭代两个图像，并设置它们的src属性
注意此处this指代的是DOM对象而非jQuery对象
img/>
）.each（function（i）{
this.src="
test"
+i+"
.jpg"
;
test0.jpg"
<
test1.jpg"
size（）/length
获取对象中元素的个数
）.size（）;
）.length;
返回Number
index（[subject]）
匹配的元素，并返回相应元素的索引值，从0开始计数
ul>
liid="
foo"
foo<
/li>
bar"
bar<
baz"
baz<
/ul>
$（'
li'
）.index（$（'
#bar'
））;
//1
li:
gt（0）'
）.index（'
//1
）.index（）;
get（）/get（index）
get（）:
以数组形式取得所有匹配的节点集合
get（index）:
index存在则从中选择某一个DOM节点
test2.jpg"
）.get（0）;
Reslut:
Element>
/Element
以对象形式获取第index个元素，位置从0算起
获取匹配的第二个元素
Thisisjustatest.<
Soisthis<
）.eq
（1）
补充.get（index）和.eq（index）的区别
.get（index）返回的是一个html数组
.eq（index）返回的是一个Jquery对象
ulli"
）.get
（1）.css（"
color"
"
//这个是错误的
）.eq
（1）.css（"
//这个是正确的同理将JQuery对象转换为DOM对象可以使用get
alert一个非JQuery对象，如：
var$cr=$（"
#cr"
varcr=$cr.get（0）;
alert（cr.checked）;
first（）
获取匹配的第一个元素
）.first（）等价于$（'
first'
last（）
获取匹配的最后一个元素
）.last（）等价于$（'
last'
filter（fn）
筛选出与指定函数返回值匹配的元素集合
保留子元素中不含有ol的元素。
ol>
li>
/ol>
Howareyou?
）.filter（function（index）{
return$（"
ol"
this）.length==0;
has（expr）
保留包含特定后代的元素，去掉那些不含有指定后代的元素
listitem1<
listitem2
listitem2-a<
listitem2-b<
listitem3<
listitem4<
）.has（'
ul'
）.css（'
background-color'
'
red'
not（expr）
删除与指定表达式匹配的元素
从p元素中删除带有select的ID的元素
pid="
HelloAgain<
）.not（$（"
#selected"
）[0]）
find（expr）
搜索所有与指定表达式匹配的元素
从所有的段落开始，进一步搜索下面的span元素。
与$（"
pspan"
）相同。
/span>
howareyou?
）.find（"
span"
next（[expr]）
取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合
找到每个段落的后面紧邻的同辈元素。
AndAgain<
）.next（）
找到每个段落的后面紧邻的同辈元素中类名为selected的元素。
）.next（"
.selected"
prev（[expr]）
前面的同辈元素
同上
children（[expr]）
子元素集合
parent（[expr]）
父元素集合
siblings（[expr]）
符合条件的所有同辈元素的元素集合
找到每个div的所有同辈元素。
div"
）.siblings（）
is（expr）
如果元素集合中有一个元素符合表达式，返回true
form>
/form>
input[type='
checkbox'
）.parent（）.is（"
form"
Result：
True
判断元素是否处于动画状态
if（!
$（element）.is（"
））{…}
返回Boolean
end（）
回到最近的一个"
破坏性"
操作之前。
即，将匹配的元素列表变为前一次的状态
所谓的"
就是指任何改变所匹配的jQuery元素的操作。
如：
add,andSelf,children,filter,find,map,next,nextAll,not,parent,parents,prev,prevAll,siblings,slice,clone。
选取所有的p元素，查找并选取span子元素，然后再回过来选取p元素
howareyou?
）.end（）
howareyou?
文本处理
append（）
$（A）.append（B）将B的内容追加到A元素内
我想说：
）.append（"
b>
你好<
/b>
appendTo（）
$（A）.appendTo（B）将A的内容追加到B元素内
）.appendTo（"
replaceWith（）
$（A）.replaceWith（B）将B的内容替换到A节点
）.replaceWith（"
你最不喜欢的是？
replaceAll（）
$（A）.replaceAll（B）将A的内容替换到B节点
）.replaceAll（"
remove（）
移出节点
ulli:
）.remove（）;
）.remove（"
li[title!
=菠萝]"
empty（）
清空节点
）.empty（）;
该节点里的文本内容和子节点将全部清空
Css
css（name,value）
取得一个元素的css值或设定一个元素的css值
）.css（"
#cc0000"
和attr方法一样，可以同时赋值多个css属性
）.css（{"
font-size"
14px"
offset（）
取得元素在当前窗口中的定位值，返回两个属性left,top
varoffset=$（"
）.offset（）;
varleft=offset.left;
vartop=offset.top;
返回Object{top,left}
position（）
取得元素相对于最近一个
position为relative
或position为absolute的父节点定位值，返回两个属性left,top
varposition=$（"
）.position（）;
varleft=position.left;
vartop=position.top;
scrollLeft（[val]）
获取或设置匹配元素相对滚动条左侧的偏移
取得浏览器滚动条的左边界
$（window）.scrollLeft（）
获取第一段相对滚动条顶部的偏移
2ndParagraph<
varp=$（"
p:
）.text（"
scrollTop:
+p.scrollTop（））;
0<
scrollTop（[val]）
获取或设置匹配元素相对滚动条顶部的偏移
取得浏览器滚动条的上边界
$（window）.scrollTop（）
height（[val]）
取得对象的高度，或赋值对象的高度
浏览器可视区域的高
$（window）.height（）;
width（[val]）
取得对象的宽度，或赋值对象的宽度
#gooDiv"
）.width（300）;
innerHeight（）
obj的自身大小+padding大小
innerWidth（）
outerHeight（[true]）
obj自身大小+padding大小+border大小
如果属性true：
obj自身大小+margin大小+padding大小+border大小
outerWidth（[true]）
事件
bind（type,[data,]fn）
对象事件响应，event可以是JS事件，也可以是JQuery事件
#foo'
）.bind（'
click'
function（）{
alert（'
Userclickedon"
foo."
'
多个事件捆绑，每个事件类型用空格分隔：
mouseentermouseleave'
$（this）.toggleClass（'
entered'
在jQuery1.4中，可以通过传入一个映射对来一次绑定多个事件
升级会员 