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

    标签选择器
    $('p').css('color','red');


    类选择器
    $('.one').css('color','blue');


    id选择器
    $('#for').css('color','orange');

    属性选择器 带有size属性的
    $('[size]').css('border','1px solid red');

    属性值等于多少的
    $('[size=20]').css('color','red');


    属性值中开头包含beijing的
    $('[address^=beijing]').css('color','red');
    属性值结尾有com的
    $('[value$=com]').css('color','red');
    属性值不包含shanhai的
    $('[address!=shanghai]').css('color','red');
    属性之中有class属性属性值中还有t
    $('[class*=t]').css('color','red');

    并且关系属性选择器  同时符合这几种属性的

    $('[attr=value],[attr1=value1],[attr2=value2],[attr3=value3]');

    属性中包含这个标签的
    $('div span').css('color','red');


    属性的向下兄弟标签(多个)
    $('div~span').css('color','red');

    $('div').nextAll('span').css('background', 'lightgray');

    属性向下查找兄弟标签(一个)
    $('div+span').css('color','red');

    $('div').next('span').css('font-size', '50px');

    获取ID为one的多有的同辈元素为div的(不论前后)
    $(#one).suiblings('div')

    获取ID为one元素的前面紧邻的同辈div元素
    $(#one).prev('div')


    属性的子标签 直接子节点,不嵌套任何标签的子节点
    $('div>span').css('color','red');

    div下的所有span  a标签中的span也包含在内(不是直接子节点)

    $('div span').css('color','pink') 

    //属性中第一个 最后一个 指定第几个:eq()
    $('li:first').css('color','red');
    $('li:last').css('color','red');
    $('li:eq(3)').css('color','red');

    //属性中gt大于 lt小于 混合使用会清0
    //:gt() great than 大于指定下标的元素 不包含
    //:lt() less than
    $('li:gt(4)').css('color','red');
    $('li:lt(1)').css('color','red');
    $('li:gt(2):lt(3)').css('color','red');

    //even偶数 odd奇数 下标从0开始
    $('li:even').css('color','red');
    $('li:odd').css('color','yellow');

    //:header 选择页面上的所有标题标签 h系列
    $(':header.h').css('color','red');

    在li中除啦class是one的所有的元素
    $('li:not(.one)')

    属性中包含这个值得 :contains
    $('span:contains(老树)').css('color','yellow');


    :has(tag) 节点内部包含tag标签的标签
    $('div span').css('color','yellow');
    $('div:has(span)').css('color','yellow');


    获取作为父节点的div里的子标签
    $('div:parent').css('color','red');


    //获取空的标签:empty
    $('*:empty').css('border','1px solid red');

    多选框选择器

    类名为hobby的多选框中  下标为0的value

    $('.hobby:checked')[0].value

    群组选择器

  • 相关阅读:
    Android——继续深造——从安装Android Studio 2.0开始(详)
    PHP——安装wampserver丢失MSVCR110.dll
    Marza Gift for GDC 2016
    Retrieve OpenGL Context from Qt 5.5 on OSX
    Space Time Varying Color Palette
    Screen Space Depth Varying Glow based on Heat Diffusion
    Visualization of Detail Point Set by Local Algebraic Sphere Fitting
    Glass Dragon
    Jump Flood Algorithms for Centroidal Voronoi Tessellation
    京都之行
  • 原文地址:https://www.cnblogs.com/wuyaxing/p/6052219.html
Copyright © 2011-2022 走看看