jquery 选择器

一、选择器
1.1 基本
id
name
class
组合
1.2 层级选择器
A~B 之后所有的兄弟
A+B 紧挨着下一个兄弟
A B 后代选择器
A>B 子元素选择器
1.3 属性选择器
A[attr] 匹配a元素包含attr属性
A[attr=val] 匹配a元素包含attr属性值等于val
A[attr!=val] 匹配a元素包含attr属性值不等于val
A[attr^=val] 匹配a元素包含attr属性值以val开头
A[attr$=val] 匹配a元素包含attr属性值以val结尾
A[attr*=val] 匹配a元素包含attr属性值包含val
A[attr1][attr2][…] 匹配a元素包含多个属性
1.4 伪基本选择器
获取第一个元素 :first
最后一个元素 :last
去除所有与给定选择器匹配的元素 :not()
匹配所有索引值为偶数的元素,从 0 开始计数 :even
匹配所有索引值为奇数的元素,从 0 开始计数 :odd
匹配一个给定索引值的元素 eq(index)
匹配所有大于给定索引值的元素 gt(index)
匹配所有小于给定索引值的元素 lt(index)

    1.5 子元素
            :nth-child(N) 匹配其父元素下的第N个子或奇偶元素
            :first-child 匹配第一个子元素
            :last-child 匹配最后一个子元素
            :only-child 匹配父元素里面只有一个子元素
    1.6 文本选择器
            匹配包含给定文本的元素 contains(text)
            匹配所有不包含子元素或者文本的空元素 empty
            匹配含有选择器所匹配的元素的元素 has(selector)
            匹配含有子元素或者文本的元素 parent
    1.7 表单选择器
            :checked  匹配所有选中的被选中元素
            :selected 匹配所有选中的option元素

二、属性
2.1 CSS
css() 获取/设置css样式
css(‘attr’)
css({‘a1’:’val1’,..})
offset() 获取/设置 边距
offset()
offset({left:val,top:val})
event.pageX 获取鼠标x轴坐标点
event.pageY 获取鼠标y轴坐标点
scrollLeft() 获取内容x轴滚动距离
scrollTop() 获取内容y轴滚动距离
scrollTop(300);
position() 获取相对于父级元素定位距离
注意:有定位的父级元素
width() 获取元素自身的宽度
height() 获取元素自身的高度
2.2 属性
HTML代码/文本/值
html([val|fn]) 取得指定匹配元素的html内容。
text([val|fn]) 取得所有匹配元素的内容
val([val|fn|arr]) 获得匹配元素的当前值。
属性
attr() 获取设置属性
removeAttr() 移除属性
css类操作
addClass() 添加指定的类名
removeClass() 移除指定类名
toggleClass() 切换指定类名 如果这个类名存在(不存在)就是删除(添加)

三、筛选
3.1 过滤
eq(index|-index) 查找第几个
first() 查找第一个
last() 查找最后一个
hasClass(class) 查找元素包含class 的 返回布尔值
has(expr|ele) 查找包含元素的
not排除元素
3.2 查找
children([expr])匹配所有的子级元素
find():查找后代元素
next():查找下一个
prev():查找上一个
parent():查找父级
siblings():查找所有的同辈元素(不包含自己)

四、 文档处理
内部处理
append() 后追加
prepend() 前置
外部处理
after() 在每个匹配的元素之后插入内容。
before() 在每个匹配的元素之前插入内容。
替换
replaceWith() 将匹配的元素替换成指定的html文档
删除
remove() 移除
empty() 清空
克隆
clone(true)

五、效果
淡入淡出
fadeIn([speed],[easing],[fn])淡入
fadeOut([speed],[easing],[fn])淡出
fadeTo([[speed],opacity,[easing],[fn]])切换到指定的透明度
fadeToggle([speed,[easing],[fn]])// 淡入淡出的切换
基本
show(time/ms,[callback]) 显示
hide(time/ms,[callback]) 隐藏
toggle(time/ms,[callback]) 切换显示隐藏
滑动
slideDown(time/ms,[callback]) 下滑动 显示
slideUp(time/ms,[callback]) 上滑动 隐藏
slideToggle(time/ms,[callback]) 切换 滑动
自定义
animate({},time)
stop() 停止

六、AJAX
===>jQuery.get() ===> j Q u e r y . g e t ( ) .get(url, [data], [callback], [type])
.post(url,[data],[callback],[type])urldatahtmljsoncallbacktypexmlhtml()json . p o s t ( u r l , [ d a t a ] , [ c a l l b a c k ] , [ t y p e ] ) 参 数 : u r l 请 求 地 址 d a t a 数 据 h t m l j s o n c a l l b a c k 回 调 函 数 t y p e 返 回 的 数 据 类 型 x m l h t m l ( 默 认 ) j s o n .ajax(url,[settings])
参数
$.ajax({
url:’请求地址’,
type:’get(默认) post’,
data:’发送到服务器的数据’,
success:’请求成功后的回调函数’,
dataType:’预期服务器返回的数据类型 html json xml’,
async:true异步 false同步
});
七、事件、对象访问

7.1 事件
        bind('事件驱动名称',fn) 
        live('事件驱动名称',fn) 
            live({}); //绑定多个事件
            注意:bind  和 live 区别,live针对于后续追加的元素事件有效
        one('事件驱动名称',fn)        触发一次事件

7.2 对象访问
        $.each() 对象遍历
        index()  获取元素索引值
        length   获取长度
        size()   获取长度 

八、事件冒泡
原生: event.cancelBubble = true;
jquery: event.stopPropagation();
// 在js中 既能阻止事件冒泡 又能阻止元素默认行为
return false;

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值