关于jQuery的选择器

元素选择器

其实在jQ里面很多的选择器都是类似css的选择器 所以说在使用的过程中 一定要熟练的使用选择器,可以大大的提高工作效率

元素选择器顾名思义就是根据元素名来选取元素

id选择器

jQ的#id选择器是通过html给指定的元素设置id来获取的 (这里需要注意的是id选择器在唯一的,所以设置id选择器的时候请注意)

class选择器

之前上面讲述过有与c3的选择器及其相似,肯定少不了class选择器了

列举

下面为了更方便的给大家解释例举了以下实际例子参考

语法描述
$("*")选取所有的元素(跟c3中的*一样)
$(“this”)选取当前HTML
$(“p.intro”)选取class为intro的p元素
$(“p:first”)选取p里面的第一个元素
$(“ul li:first”)选取ul元素里面li的第一个元素
$(“ul li:first-child”)选取每个ul里面的第一个li的元素
$("[herf]")选取带有herf的属性
$(“li.even”)选取li里面奇数的元素
$(“li.even”)选取li里面偶数的元素
$(":button")选取所有type="button"的input和button属性
$("#id", ".class")  复合选择器
$(div p span)       层级选择器 //div下的p元素中的span元素
$(div>p)            父子选择器 //div下的所有p元素
$(div+p)            相邻元素选择器 //div后面的p元素(仅一个p)
$(div~p)            兄弟选择器  //div后面的所有p元素(同级别)
$(.p:last)          类选择器 加 过滤选择器  第一个和最后一个(first 或者 last)
$("#mytable td:odd")      层级选择 加 过滤选择器 奇偶(odd 或者 even)
$("div p:eq(2)")    索引选择器 div下的第三个p元素(索引是从0开始)
$("a[href='www.baidu.com']")  属性选择器
$("p:contains(test)")        // 内容过滤选择器,包含text内容的p元素
$(":emtyp")        //内容过滤选择器,所有空标签(不包含子标签和内容的标签)parent 相反
$(":hidden")       //所有隐藏元素 visible 
$("input:enabled") //选取所有启用的表单元素
$(":disabled")     //所有不可用的元素
$("input:checked") //获取所有选中的复选框单选按钮等
$("select option:selected") //获取选中的选项元素

在这里强调以下两个符号的理解
:和[]
:你可以把这个理解为种类的的意思 p:first p种类的第一个
[]很自然的理解为属性的意思:[type]带有type的属性

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值