zoukankan      html  css  js  c++  java
  • 第二章《jQuery选择器(二)》

      在该章节会给大家介绍一些常用的jQuery选择器。

      一、CSS选择器

      (1)$("#id")  //id选择器

      (2)$(".className")  //类选择器  用于选择引用了该样式类的元素

      例:$(".myClass") 选择所有应用了myClass样式的元素

      (3)$("tagName")  //HTML标签选择器 用于选择某些标签元素

      例:$("p") 选择所有的p标签元素

      (4)$("selector1,selector2,...,selectorN") //群组选择器

      例:$("div,span,p.myClass") //选择所有的div、span以及应用了myclass样式的p元素

      (5)$("*")  //通用选择器 该写法则获取文档中所有元素

      例:$("*",$("#div1"))   获取id为div1中的所有子元素;

      二、层级选择器

      (1)$("parent>child")  //子元素选择器 其中parent是任何有效的选择器,child也是一个选择器,用于筛选子元素

      例:$("ul.myClass>li") 选择应用了myclass样式类下面的所有li元素

      (2)$("ancestor descendant") //后代选择器 其中ancestor是任何有效的选择器 descendant也是一个选择器用于筛选后代元素,其中以空格分隔。

      例:$("ul.myClass li") 选择应用了myclass样式类下面的所有li元素

      注:该选择器与子元素选择器不同之处在于,子元素选择器只负责筛选当前父级下的第一层子集。而后代选择器则筛选当前父级下面的所有子集。

      (3)$("prev+next")  //紧邻同辈元素选择器 其中prev和next都是有效的选择器 两者之间用"+"相连

      例:$("#id+li") //表示选择紧跟在#id标签后面的并且为同级的li标签

      (4)$("prev~siblings")  //相邻同辈元素选择器 其中prev和siblings都是有效的选择器 两者之间用“~”相连

      例:$("#prev~div")  //表示选择在#prev元素后面 同辈的div元素

      三、表单域选择器

      (1)$(":input")  //input选择器 用于选择所有的input标签

      (2)$(":text")  //text选择器 用于选择所有的单行文本框 如:(<input type="text"/>)

      (3)$(":password")   //password选择器 用于选择所有的密码框  如:(<input type="password"/>)

      (4)$(":radio")  //radio选择器 用于选择所有单选按钮

      (5)$(":checkbox")  //checkbox选择器 用于选择所有的复选框

      (6)$(":file")  //file选择器 用于选择所有的文本域 如:(<input type="file"/>)

      (7)$(":image")  //image选择器 用于选择所有的图像域 如:(<input type="image"/>)

      (8)$(":hidden")  //hidden选择器 用于选择所有不可见元素 如:display:none 以及 <input type="hidden" />

      (9)$(":button")  //button选择器 用于选择所有按钮

      (10)$(":submit")  //submit选择器 用于选择所有提交按钮

      (11)$(":reset")  //reset选择器 用于选择所有重置按钮

      在本章节中给大家介绍了一些比较常用的选择器,但在实际当中往往需要在选择的集合中进行筛选才能得到真正想要操作的元素。所以在下一章节中我会给大家介绍一些常用的过滤选择器。

  • 相关阅读:
    智能推荐算法演变及学习笔记(三):CTR预估模型综述
    从中国农业银行“雅典娜杯”数据挖掘大赛看金融行业数据分析与建模方法
    智能推荐算法演变及学习笔记(二):基于图模型的智能推荐(含知识图谱/图神经网络)
    (设计模式专题3)模板方法模式
    (设计模式专题2)策略模式
    (设计模式专题1)为什么要使用设计模式?
    关于macOS上常用操作命令(持续更新)
    记录下关于RabbitMQ常用知识点(持续更新)
    EMERGENCY! EUREKA MAY BE INCORRECTLY CLAIMING INSTANCES ARE UP WHEN THEY'RE NOT. RENEWALS ARE LESSER THAN THRESHOLD AND HENCE THE INSTANCES ARE NOT BEING EXPIRED JUST TO BE SAFE.
    SpringCloud教程二:Ribbon(Finchley版)
  • 原文地址:https://www.cnblogs.com/zyj469470971/p/2354298.html
Copyright © 2011-2022 走看看