筛选选择器
伪类选择器 :XX()
:eq() 根据索引找元素,从0开始
:first() 第一个子元素
:last()最后一个子元素
:nth-child(index) 根据序号找元素,从1开始
$('ul li:eq(3)').css('color','green');
$('ul li:first').css('color','red');
$('ul li:last').css('color','red');
$('ul li:nth-child(4)').css('background','yellow');
属性选择器
$('input:radio')
------> $('input[type = radio])
筛选方法 --- 链式编程
筛选选择器是jQuery延伸出来的用法,有一些选择器已经作为
方法包装在了jQuery中,结果是等价的
.eq() 根据索引找元素,从0开始
.first() 第一个子元素
.last() 最后一个子元素
.text() 相当于JS的 innertext()
.find(' ') 找儿子和孙子们 ()中可以写选择器
.children(' ' ) 找儿子们 ()中可以写选择器
.parent() 找亲爹
.siblings() 找兄弟,除自己之外 ()中可以写选择器
$('ul').find('li')
$('ul').children('li')
$('ul').parent()
$('ul').siblings('.box')
siblings实现选项卡
由于是链式编程,速度快,不需像2个for循环那样,先变回原来颜色,几乎是同时操作
$('ul li a').click(function(){ $(this).addClass('active').parent().siblings('li').find('a').removeClass('active');
})
类的相关方法
.addClass('') 添加类,不需像JS中前面加空格
.removeClass('a b c') 删除类,若是只有一个类也能删除
.toggleClass('a') 若是有类a,就删除,没有就添加
值操作
.html() 中间有值就是修改或添加
获取的文本包括标签
<p>alex</p>
.text() 中间有值就是修改或添加
只获取文本,不获取标签
.val() 中间有值就是修改或添加
.val()方法主要用于获取表单元素的值,如input, select 和 textarea。当在一个空集合上调用,它返回undefined
获取value属性值
<input type='text' value='哈哈哈'>
$('input:text').val()
对象和标签属性操作
对象属性
#如果有一个参数,表示获取值,两个参数,设置值
.prop()
# 移除单个值或者多个值,多个值用空格隔开
.removeProp()
标签属性
如果有一个参数,表示获取值,两个参数,设置值 .attr('href','http://www.baidu.com')
# 移除单个值或者多个值,多个值用空格隔开
.removeAttr()