第六章 jQuery选择器

jQuery选择器概述:

  选择器jQuery基础,在jQuery中,对事件处理,遍历DOM和Ajax操作都依赖于选择器。

什么是jQuery选择器:

  jQuery选择器拥有良好的浏览器兼容性,不用使用CSS选择器那样需要考虑各个浏览器对它的支持情况。

jQuery选择器的优势:

  简洁的写法;

  完善的处理机制;

jQuery选择器的类型:

  通过CSS选择器选取的元素:

    基本选择器;

    层次选择器;

    属性选择器;

  通过过滤选择器选择元素:

    基本过滤选择器;

    可见性过滤选择器;

基本选择器:

    

  标签选择器:

      

  类选择器:

      

  id选择器:

      

  并集选择器:

      

  全局选择器:

      

层次选择器:

    

  后代选择器:

      

  子选择器:

      

  相邻元素选择器:

      

  同辈元素选择器:

      

属性选择器:

  

  

基本过滤选择器:

    

    

    

 

可见性过滤选择器:

    

    

 

 

转载于:https://www.cnblogs.com/wnwn/p/11010923.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
jQuery选择是一种用于选择HTML元素的语法。它可以根据元素的ID、类、类型、属性、属性值等进行选择。以下是一些常见的jQuery选择: 1. 根据元素类型选择:$("p") 选取所有 <p> 元素。 2. 根据元素ID选择:$("#id") 选取 ID 为 "id" 的元素。 3. 根据元素类选择:$(".class") 选取所有 class 为 "class" 的元素。 4. 根据元素属性选择:$("[attribute]") 选取带有 attribute 属性的元素。 5. 根据元素属性值选择:$("[attribute=value]") 选取 attribute 属性值为 "value" 的元素。 6. 根据元素属性值选择(部分匹配):$("[attribute*=value]") 选取 attribute 属性值包含 "value" 的元素。 7. 根据元素属性值选择(以某个值开头):$("[attribute^=value]") 选取 attribute 属性值以 "value" 开头的元素。 8. 根据元素属性值选择(以某个值结尾):$("[attribute$=value]") 选取 attribute 属性值以 "value" 结尾的元素。 9. 根据元素属性值选择(以某个值开头且包含某个值):$("[attribute|=value]") 选取 attribute 属性值以 "value" 开头且包含 "value" 的元素。 10. 根据元素的位置选择:$("selector:first") 选取第一个匹配的元素,$("selector:last") 选取最后一个匹配的元素,$("selector:even") 选取偶数位置的元素,$("selector:odd") 选取奇数位置的元素,$("selector:eq(index)") 选取索引为 index 的元素,$("selector:gt(index)") 选取索引大于 index 的元素,$("selector:lt(index)") 选取索引小于 index 的元素。 11. 根据元素的关系选择:$("parent > child") 选取 parent 元素的直接子元素 child,$("prev + next") 选取 prev 元素后面的第一个同辈元素 next,$("prev ~ siblings") 选取 prev 元素后面的所有同辈元素 siblings。 以下是一个例子: ```javascript <!DOCTYPE html> <html> <head> <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function(){ $("button").click(function(){ $("p").hide(); }); }); </script> </head> <body> <h2>This is a heading</h2> <p>This is a paragraph.</p> <p>This is another paragraph.</p> <button>Click me to hide paragraphs</button> </body> </html> ``` 当用户点击按钮时,所有的段落元素都会被隐藏起来。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值