day58

JQ高级

一、选择器

1、css语法匹配

标签 | 类 | id | 交集
群组 | 后代 | 兄弟
伪类 | 属性

2、索引匹配

:eq(index) | :gt(index) | :lt(index)

二、文本、属性与类

1、文本

html([val|fn])
text([val|fn])
val([val|fn|arr])

2、属性

attr(name|pro|key,val|fn)
removeAttr(name)
prop(n|p|k,v|f)
removeProp(name)

3、类

addClass(class|fn)
removeClass([class|fn])
toggleClass(class|fn[,sw])

三、事件

1、on绑定

$('.box').on('click', {num: 10}, function(ev) {
    console.log(ev.data.num)
})
// 数据由ev.data存储

2、非on事件

$('.box').click({num: 10}, function(ev) {
    console.log(ev.data.num)
})
// 数据由ev.data存储

3、解绑

$('.box').off()

四、文档操作

1、内部插入

append(content|fn)
appendTo(content)
prepend(content|fn)
prependTo(content)

2、外部插入

after(content|fn)
before(content|fn)
insertAfter(content)
insertBefore(content)

3、包裹

wrap(html|ele|fn)
unwrap()
wrapAll(html|ele)
wrapInner(html|ele|fn)

4、替换

replaceWith(content|fn)
replaceAll(selector)

5、删除

empty()
remove([expr])
detach([expr])

6、复制

clone([Even[,deepEven]])

五、动画

1、基本

show([s,[e],[fn]])
hide([s,[e],[fn]])
toggle([s],[e],[fn])

2、滑动

slideDown([s],[e],[fn])
slideUp([s,[e],[fn]])
slideToggle([s],[e],[fn])

3、淡入淡出

fadeIn([s],[e],[fn])
fadeOut([s],[e],[fn])
fadeTo([[s],o,[e],[fn]])
fadeToggle([s,[e],[fn]])

4、自定义

animate(p,[s],[e],[fn])

六、结构关系

children([expr])
parent([expr])
parents([expr])
next([expr])
nextAll([expr])
prev([expr])
prevAll([expr])
siblings([expr])

猜你喜欢

转载自www.cnblogs.com/yaoxiaofeng/p/9838511.html