• jquery独特的选择器


    最近开始学习jquery,发现jquery的强大真的不是一两句话就能概括的。jquery是一个用原生JS写出来的类库,它强调的理念是写得少,做的多。jquery独特的选择器、链式操作、事件处理机制和封装完善的Ajax都是其他类库望尘莫及的。

    要使用jquery的话,只需要在jquery.com官网下下载源代码,并且用<script></script>标签进行引用就能使用了。

    类似:

    1 <script src="../scripts/jquery.js" type="text/javascript"></script>

    在jquery当中,很重要的一个是它的独特的选择器,相比于javascript中的getELementById或者getElementsBytTagName的选择器而言,jquery的选择器就相对简单得多了,代码也少的多了。只需要一个$()就能获取无论是通过ID还是class还是标签名等等,当然,jquery()也可以,因为在jquery中$相当于jquery。

    总结的选择器:

    一、基本选择器

    通过id:#id;示例$("#wrap"),意思是获取id为wrap的元素。

    通过class:.class;示例$(".wrap"),意思是获取class为wrap的元素。

    *:通配符;$("*"),意思是获取所有元素。

    二、层次选择器

    $("ancestor desendant"),意思获取ancestor里面的desendant元素。

    $("parent>child"),意思获取parent下的child子元素。

    $("prev+next"),意思获取prev元素后下一个的next元素。

    $("prev~sibling"),意思获取prev元素之后的所有sibling元素。

    三、过滤选择器

    1.基本过滤选择器

    $("div.c:first"),意思是选取class名为c的所有div中的第一个div。

    $("div.c:last"),意思是选取class名为c的所有div中的最后一个div。

    $("div.c:not(.a)"),意思是选取class名为c的所有div中的不含有a这个class的div。

    $("div.c:even"),意思是选取class名为c的所有div中的索引为偶数的div(从0开始算,0算偶数)。

    $("div.c:odd"),意思是选取class名为c的所有div中的索引为奇数的div(从0开始算)。

    $("div.c:eq(2)"),意思是选取class名为c的所有div中的索引为2的div(从0开始算)。

    $("div.c:gt(2)"),意思是选取class名为c的所有div中的索引大于2的div(从0开始算,不包括2)。

    $("div.c:lt(2)"),意思是选取class名为c的所有div中的索引小于2的div(从0开始算,不包括2)。

    $("div.c:header"),意思是选取class名为c的所有标题标签。

    $(":animated"),意思是选取当前正在执行动画的元素。

    $(":focus"),意思是选取当前获取焦点的元素。

    2.内容过滤器

    $(":contains(text)"),意思是文本内容包含”text“的元素。

    $(":empty"),意思是选取不包含子元素或者文本内容为空的元素。

    $(":has(p)"),意思是选取含有p元素的元素。

    $(":parent"),意思是选取含有子元素或者文本的元素。

    3.可见性过滤选择器

    $(":hidden"),意思是选取所有不可见的元素。

    $(":visible"),意思是选取所有可见的元素。

    4、属性过滤器

    [attribute],意思是选取所有拥有此属性的元素。

    [attribute=value],意思是选取所有拥有此属性值为value的元素。

    [attribute!=value],意思是选取所有拥有此属性值不为value的元素。

    [attribute^=value],意思是选取此属性的值以value为开始的元素。

    [attribute$=value],意思是选取此属性的值以value为结束的元素。

    [attribute*=value],意思是选取此属性值含有value的元素。

    [attribute|=value],意思是选取此属性的值等于value或者以value为前缀的元素。

    [attribute~=value],意思是选取此属性的值用空格分隔并且含有value的元素。

    5、子元素过滤选择器

    $("div.a:nth-child(1)"),意思是选取class为a下的索引为1的子元素(索引从1开始算起,索引可以是even,odd,n的函数)。

    $("div.a:first-child"),意思是选取class为a下的第一个子元素

    $("div.a:last-child"),意思是选取class为a下的最后一个子元素

    $("ul li:only-child"),意思是选取ul下的是唯一子元素的li元素

    6、表单对象属性过滤选择器

    $("form:enabled"),意思是选取form下的所有可用子元素

    $("form:disabled"),意思是选取form下的所有不可用子元素

    $("form:checked"),意思是选取form下的所有选中的input元素

    $("form:selected"),意思是选取form下的所有被选中的选项option元素


    $(":parent"),意思是选取含有子元素或者文本的元素。

  • 相关阅读:
    ImageSwitcher (图像切换器,显示图片)
    RatingBar
    SeekBar
    Assets 读取assets中的文件
    开关按钮(ToggleButton&Switch)
    MEF学习
    HttpWebRequest简单使用
    Redis学习
    SQL Join简单介绍
    EF 数据迁移
  • 原文地址:https://www.cnblogs.com/178-533/p/7447276.html
Copyright © 2020-2023  润新知