jquery属性选择器

最新推荐文章于 2022-01-24 07:00:00 发布
最新推荐文章于 2022-01-24 07:00:00 发布
阅读量935 收藏
点赞数
文章标签： jquery div button function input class
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/mengyun00/article/details/7384603
版权

1）[attribute]：匹配包含给定属性的元素

   eg:$("#btn").click(function(){

       //点击按钮后将含有id属性的div背景变为绿色

       $("div[id]").css("background","color");

       });

      <body>

        <input type="button" value="将含有id属性的div背景变为绿色" id="btn">

        <div id="one"></div>-----------绿色

        <div></div>

        <div id="three"></div>---------绿色

      </body>

2）[attribute=value]：匹配给定的属性是某个特定值的元素

   eg:$("#btn").click(function(){

       //点击按钮后将id=one的div背景变为绿色

       $("div[id=one]").css("background","color");

       });

      <body>

        <input type="button" value="将id=one属性的div背景变为绿色" id="btn">

        <div id="one"></div>---------绿色

        <div></div>

        <div id="three"></div>

      </body>

3）[attribute!=value]：匹配所有不含有指定的属性，或者属性不等于特定值的元素。

   eg:$("#btn").click(function(){

       //点击按钮后将id!=one的div背景变为绿色

       $("div[id!=one]").css("background","color");

       });

      <body>

        <input type="button" value="将id!=one属性的div背景变为绿色" id="btn">

        <div id="one"></div>

        <div></div>--------------绿色

        <div id="three"></div>--------------绿色

      </body>

4）[attribute^=value]：匹配给定的属性是以某些值开始的元素

   eg:$("#btn").click(function(){

       //点击按钮后将id以a开头的div背景变为绿色

       $("div[id^=a]").css("background","color");

       });

      <body>

        <input type="button" value="将id以a开头的div背景变为绿色" id="btn">

        <div id="one"></div>

        <div id="abcd"></div>---------------绿色

        <div id="three"></div>

      </body>

5）[attribute$=value]：匹配给定的属性是以某些值结尾的元素

     eg:$("#btn").click(function(){

       //点击按钮后将id以d结束的div背景变为绿色

       $("div[id$=d]").css("background","color");

       });

      <body>

        <input type="button" value="将id以d结束的div背景变为绿色" id="btn">

        <div id="one"></div>

        <div id="abcd"></div>-------------绿色

        <div id="three"></div>

      </body>

6）[attribute*=value]：匹配给定的属性是以包含某些值的元素

    eg:$("#btn").click(function(){

       //点击按钮后将id包含b的div背景变为绿色

       $("div[id*=b]").css("background","color");

       });

      <body>

        <input type="button" value="将id包含b的div背景变为绿色" id="btn">

        <div id="one"></div>

        <div id="abcd"></div>---------------绿色

        <div id="three"></div>

      </body>

7）[selector1][selector2][selectorN]：复合属性选择器，需要同时满足多个条件时使用

   eg:$("#btn").click(function(){

      //点击按钮后将有class属性且id含有f的div背景颜色变为绿色

       $("div[class][id*=f]").css("background","color");

       });

      <body>

        <input type="button" value="将含有id属性的div背景变为绿色" id="btn">

        <div id="one"></div>

        <div id="two"></div>

        <div id="three"></div>

        <div id="four" class="abcd">--------------------------绿色

      </body>

 

 

 

 

 

  

mengyun00
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
jQuery属性选择器用法实例分析
10-16
主要介绍了jQuery属性选择器用法,结合实例形式分析了jQuery属性选择器功能、用法及相关操作注意事项,需要的朋友可以参考下
jQuery 属性选择器element[herf*='value']使用示例
10-26
首先，`element[attribute*='value']`是jQuery中的一种属性选择器，它用于选取具有指定属性，并且该属性的值包含给定子字符串的所有元素。例如，如果你有多个链接`<a>`，并且其中某些链接的`href`属性值包含了字符串...
jQuery属性选择器
dly的博客
12-19 281
jQuery属性选择器 [属性名] 获得指定的属性名的元素 [属性名=值] 获得属性名 等于 指定值的 的元素【1】 [属性名!=值] 获得属性名 不等于 指定值的 的元素 [as1][as2][as3]…. 复合选择器，多个条件同时成立。类似 where …and…and【2】 [属性名^=值]
JQuery中属性选择器
你今天真好看呀
11-01 717
属性选择器 属性名称选择器 语法： $("A[属性名]")包含指定属性的选择器 属性选择器 语法： $("A[属性名='值']") 包含指定属性等于指定值的选择器 复合属性选择器 语法：$("A[属性名='值'][]...")包含多个属性条件的选择器 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> ...
jQuery之属性选择器
python全栈
01-24 4083
属性选择器 [attribute]匹配包含给定属性的元素 $("a").addClass("myClass"); $("a[href]").addClass("myClass"); [attribute1][attribute2]复合属性选择器，需要同时满足多个属性 $("a[href][title]").addClass("myClass"); [attribute=value]匹配给定的属性是某个特定值的元素 $("a[href='film-2.html']").addClass("myClas
jQuery-属性选择器
u011121046的专栏
06-01 404
$("li:first"),得到一组相同标签中的第一个元素 $("li:last"),得到一组相同标签中的最后一个元素 $("list:eq(index)"),灵活的选取一组中任意一个元素 $("list:contains('土豪')")，按照文本内容来查找一个或多个元素，它的功能是选择包含指定字符串的全部元素 $("list:has(‘selector’)"),按
jQuery属性选择器用法示例
10-21
主要介绍了jQuery属性选择器用法,结合实例形式分析了jQuery中针对属性的判断与匹配相关操作技巧,需要的朋友可以参考下
jquery-属性选择器
ginger_mr的博客
03-02 180
jquery-属性选择器 属性选择器 代码演示 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>层级选择器</title> <link rel="stylesheet" href="css/style.css" /> &lt...
JQuery 属性选择器
七七的博客
06-14 154
属性选择器 属性名称选择器 语法: $(“A[属性名]”)包含指定属性的选择器 属性选择器 语法: $(“A[属性名=‘值’]”)包含指定属性等于指定值的选择器 复合属性选择器 语法: $(“A[属性名=‘值’][]…”) 包含多个属性条件的选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>JQuery属性选择器</title
JQuery属性选择器
jason123345的博客
12-29 657
今天我们学习一下JQuery属性选择器，方便我们调用不同类型的属性。  一、属性选择器 代码： &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8" /&gt; &lt;title&gt;&lt;/title&gt; &lt;script src="sc
JQuery 属性选择器 [id^=btn]
houyanhua1的专栏
12-18 1612
$('input');  //所有input元素 $('input[id]'); //input元素中，设置了id属性的所有元素。 $('input[id=btn1]'); //input元素中，id=btn1的元素。 $('input[id*=btn]'); //input元素中，id包含btn的所有元素。 $('input[id^=btn]'); //input元素中，id以btn开头
jQuery中的属性选择器
lkjhchen的博客
06-25 637
本篇文章只是《jQuery in Action》中属性选择器章节的翻译，翻译的主要原因是本人最近买了一本《jQuery实战(第三版)》，打算系统的过一遍知识点。结果那个翻译的实在不敢恭维（我怀疑好多地方是软件直接翻的），挺多地方还翻译错了。我说你出一本书至少也负点责任，别人可是花钱买的呀！喂！到头来还得自己去看原版。下面附上自己的翻译，不敢说会有多好，但保证句子通顺，知识点正确（主要是这章卖书的那
Jquery属性选择器
菲律宾铁猴子的博客
07-22 105
1.通过某个元素的id取到元素中的value值： //例： <#input id="id" name="name" value="zzh" /> console.log($("#id").val()) //控制台打印"zzh" 2.通过某个元素及其值取到整个元素 //例： $('[name="zzh"]').each(function(index,item){ console.log(item) }) //即 遍历页面中所有name="zzh"的元素，打印在控制台中 3.弹窗获取父
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值