zoukankan      html  css  js  c++  java
  • jQuery 选择器

      css选择器

      Id选择器  class选择器  标签选择器  后代选择器  交级选择器  并级选择器  通配符选择器  结构选择器  伪类选择器  属性选择器  相邻选择器  兄弟选择器

      而jQuery完美的兼容了css的选择器   让我们通过更简单的方式,去获取到标签;

      https://code.jquery.com/jquery-3.3.1.js   

      重要的一个:children("div")  父元素的所有子级div

      基本:

        css选择器    jQuery写法

        id获取        $("#id")

        class获取      $(".class")

        标签获取       $("div")

        *         $("*")

        selector1,selector2,selectorN (将所有选择器合并到一起返回新的结果)    $("div,span,p.myClass")    并级和交级的结合,合并成新的结果

      层级

        后代      $("div p")   div下所有的p标签

        子代      $("div>p")   div的子标签为p的

        相邻      $("div+p")    div开始的下一个p标签(同一级)

        兄弟      $("div~p")  div开始后面的p标签 (同一级)

      基本:

        :first                     $("li:first")  获取匹配的第一个标签

        :not      $("div:not")  将匹配的内容 清除

        :even     $("div:even")  匹配''索引''为偶数的内容

        :odd      $("div:odd")  匹配''索引''为奇数的内容     

        :eq()      $("div:eq(0)")  匹配指定索引为0的内容

        :gt()      $("div:gt(0)")  同级 匹配指定索引之后的所有内容

        :lang      $("div:lang(en)")  将匹配到<div lang="en></div> 他的文本紧跟着~的符号  不常见

        :last      $("div:last")  匹配到最后的内容

        :lt()      $("div:lt(2)")  匹配索引小于2的所有内容  

        :header    $(":header")  获取h1到h6的内容

        :animated    $("div:not(animated)")   指对没有执行动画的效果,执行一次动画的效果

        :focus      $(":focus")  指匹配到获取焦点的内容

        :root      $(":root")       匹配到当前的根节点   跟HTML一样的效果

        :target    $("p:target")     将匹配到       给定的URI http://example.com/#foo     <p id="foo"></p>

      内容:

        :contains(text)    $("div;contains(111)")   匹配包含给定文本的元素

        :empty        $("div:empty")  匹配所有不包含子元素或者文本的空元素    返回的结果<div><div>

        :has(selector)    $("div:has(p)")    匹配div中含p标签的div(用于过滤)

        :parent      $("p:parent")    匹配所有的p元素包括p的文本

      可见:

        :hidden    $("div:hidden")    匹配所有看不见的元素  或者type为hidden的元素

        :visible    $("div:visible")    匹配所有可见的元素

      属性:                  返回的结果

        [attribute]      $("div[id]")  <div id="a"></div>

        [attribute=value]    $("div[id='b']")  <div id="b"></div>

        [attribute!=value]    $("div[id!='a']")  <div id="c"></div>

        [attribute^=value]    $("div[id^='a']")  <div id="ab"></div>  <div id="ac"></div>

        [attribute$=value]    $("div[id$='a']")  <div id="ba"></div>  <div id="ca"></div>

        [attribute*=value]     $("div[id*='a']")  <div id="ab"></div>  <div id="ba"></div>   <div id="bac"></div>

        [attrSel1][attrSel2][attrSelN]  $("div[id][name$='man']")  <div id="xman" name="xman"><div>  

      子元素:

        :first-child    $("ul li:first-child")  ul下第一个子元素li

        :first-of-type    $("ul li:first-of-type")  ul下所有li中的第一个li

        :last-child    $("ul li:last-child")  ul下最后一个元素li

        :last-of-type    $("ul li:last-of-type")        ul下所有li中的最后一个li

        :nth-child    $("ul li:nth-child(2)")  ul下第二个元素li

        :nth-last-child  $("ul li:nth-last-child(2)")  ul下倒数第二个元素li

        :nth-last-of-type  $("ul li:nth-last-of-type(2)")  ul下所有li中第二个li

        :nth-of-type    $("ul li:nth-of-type(2)")  ul下所有li中第二个li

        :only-child    $("ul li:only-child")  ul下只能有一个li

        :only-of-type   $("ul li:only-of-type")  ul下唯一的标签li

      表单:

        :input    $(":input")  查找所有的input元素    像textarea(文本域)  button(按钮)  都会被匹配到

        :text    $(":text")  匹配单行文本框

        :password    $(":password")  匹配所有的密码框

        :radio    $(":radio")  匹配所有的单选框

        :checkbox    $(":checkbox")  匹配所有的复选框

        :submit    $(":submit")    匹配所有的提交按钮

        :image    $(":image")    匹配所有的图像域

        :reset      $(":reset")    匹配所有的重置按钮

        :button    $(":button")    匹配所有按钮

        :file    $(":file")    匹配所有的文件域

        :hidden    $(":hidden")    匹配所有不可见元素或type为hidden

      表单对象属性:

        :enabled  $(":enabled")    匹配所有可用元素

        :disabled  $(":disabled")    匹配所有不可用元素

        :checked    $(":checked")  匹配所有选中的元素(复选框,单选框,不包括selected的option)

        :selected  $(":selected")    匹配所有option

  • 相关阅读:
    Ubuntu终端Terminal常用快捷键
    继承(一)
    c语言中动态数组的建立
    指针的一些小的知识点
    什么是内存地址
    组合(composition)与继承(inheritance)
    重载new和delete
    不要轻易delete void*指针,这样会隐藏比较多的错误。
    内存管理运算符new delete与内存管理函数malloc free的区别——已经他们对对象创建的过程。
    自动类型转换之全局重载运算符与成员重载运算符
  • 原文地址:https://www.cnblogs.com/shangjun6/p/10444673.html
Copyright © 2011-2022 走看看