zoukankan      html  css  js  c++  java
  • jQuery属性过滤选择器例子

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="../js/jquery-3.2.1.min.js"></script>
    <script>
    $(function () {
    //为包含id属性的p元素设置颜色属性
    $("p[id]").css("color", "blue");
    //为包含class="222"的p元素设置颜色属性
    $("p[class='222']").css("color", "pink");
    //为包含id属性且id的属性值以'a'开头的span元素设置颜色
    $("span[id^='a']").css("color", "green");
    //为包含id属性且id的属性值以'g'结尾的span元素设置颜色
    $("span[id$='g']").css("color", "red");
    //组合属性包含id='gg'name='11'的span元素设置颜色
    $("span[id='gg'][name='11']").css("color", "blue");
    //选取属性id里包含'123'的span元素设置颜色
    $("span[id*='123']").css("color", "purple");
    //属性id!="btn1"里按钮设置颜色
    $("input[id!='btn1']").css("color",'green');
    })
    </script>
    </head>
    <body>
    <p id="111">bbbb</p>
    <p id>ccc</p>
    <p class="222">aaaaaaaaaaaaa</p>
    <p class>ddddd</p>
    <span id="a111111">QQQQQQQQQQQ</span>
    <span id="abbb">FFFFFFFFFFFFFF</span>
    <span id="ccccg">HHHHHHHH</span>
    <span id="gg" name="11">TTTTTT</span>
    <span id="123">WWWWWW</span>
    <span id="12345">YYYYYYYY</span>
    <input type="button" id="btn1" value="111">
    <input type="button" id="btn2" value="222">
    </body>
    </html>
  • 相关阅读:
    [暑假集训Day4T1]羊圈
    [暑假集训Day3T3]平板涂色
    [暑假集训Day3T2]骑士问题
    [暑假集训Day3T1]小木棍
    [暑假集训Day2T3]团建活动
    [暑假集训Day2T2]走廊泼水节
    [暑假集训Day2T1]种树
    [暑假集训Day1T3]新的开始
    [暑假集训Day1T2]北极通讯网络
    [暑假集训Day1T1]黑暗城堡
  • 原文地址:https://www.cnblogs.com/kukai/p/10915051.html
Copyright © 2011-2022 走看看