jQuery中[attribute*=value]选择器用法实例


Posted in Javascript onDecember 31, 2014

本文实例讲述了jQuery中[attribute*=value]选择器用法。分享给大家供大家参考。具体分析如下:

此选择器能够匹配给定的属性包含某些值的元素。

语法结构:

$("[attribute*=value]")

参数列表:

参数 描述
attribute 定义要查找的属性。
value 定义要查找的值。 引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时,用以避免冲突。

实例代码:

实例一:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript"> 

$(document).ready(function(){ 

  $("button").click(function(){ 

    $("li[id*='ir']").css("color","blue"); 

  })

})

</script>

</head>

<body>

<ul>

  <li id="first">html专区</li>

  <li id="second">Jquery专区</li>

</ul>

<ul>

  <li id="third">欢迎来到三水点靠木</li>

  <li>三水点靠木欢迎您</li>

</ul>

<button>点击查看效果</button>

</body>

</html>

以上代码可以将li元素中,id属性值中带有“ir”的li元素中文本颜色设置为蓝色。

实例二:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript"> 

$(document).ready(function(){ 

  $("button").click(function(){ 

    $("li[id*=[ir]").css("color","blue"); 

  })

})

</script>

</head>

<body>

<ul>

  <li id="f[irst">html专区</li>

  <li id="second">Jquery专区</li>

</ul>

<ul>

  <li id="third">欢迎来到三水点靠木</li>

  <li>三水点靠木欢迎您</li>

</ul>

<button>点击查看效果</button>

</body>

</html>

从以上代码可以看出如何代码中含有"["或者"]"的时候,必须要带有引号,否则会造成匹配错误。

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
学习ExtJS Panel常用方法
Oct 07 Javascript
jQuery处理xml格式的返回数据(实例解析)
Nov 28 Javascript
jquery获取元素索引值index()示例
Feb 13 Javascript
Javascript学习笔记之 对象篇(四) : for in 循环
Jun 24 Javascript
JS制作简单的三级联动
Mar 18 Javascript
JavaScript中的Math.SQRT1_2属性使用简介
Jun 14 Javascript
3种js实现string的substring方法
Nov 09 Javascript
jQuery获取单击节点对象的方法
Jun 02 Javascript
利用Angularjs和bootstrap实现购物车功能
Aug 31 Javascript
AngularJS入门教程之过滤器用法示例
Nov 02 Javascript
JS实现的计数排序与基数排序算法示例
Dec 04 Javascript
JavaScript中时间格式化新思路toLocaleString()
Nov 07 Javascript
jQuery中[attribute^=value]选择器用法实例
Dec 31 #Javascript
jQuery中[attribute=value]选择器用法实例
Dec 31 #Javascript
修复bash漏洞的shell脚本分享
Dec 31 #Javascript
分享一个常用的javascript静态类
Dec 31 #Javascript
兼容Firefox的Javascript XSLT 处理XML文件
Dec 31 #Javascript
使用jquery+CSS实现控制打印样式
Dec 31 #Javascript
浅谈javascript中字符串String与数组Array
Dec 31 #Javascript
You might like
PHP+SQL 注入攻击的技术实现以及预防办法
2010/12/29 PHP
UCenter 批量添加用户的php代码
2012/07/17 PHP
php微信开发之谷歌测距
2018/06/14 PHP
thinkPHP框架整合tcpdf插件操作示例
2018/08/07 PHP
PHP PDO和消息队列的个人理解与应用实例分析
2019/11/25 PHP
PHP实现基本留言板功能原理与步骤详解
2020/03/26 PHP
jQuery插件 tabBox实现代码
2010/02/09 Javascript
JS 遮照层实现代码
2010/03/31 Javascript
jQuery之日期选择器的深入解析
2013/06/19 Javascript
JavaScript splice()方法详解
2020/09/22 Javascript
js实现刷新iframe的方法汇总
2015/04/27 Javascript
JQuery中DOM事件冒泡实例分析
2015/06/13 Javascript
jquery实现不包含当前项的选择器实例
2015/06/25 Javascript
再次谈论React.js实现原生js拖拽效果引起的一系列问题
2016/04/03 Javascript
AngularJS动态绑定HTML的方法分析
2016/11/07 Javascript
Bootstrap响应式表格详解
2017/05/23 Javascript
jQuery图片加载失败替换默认图片方法汇总
2017/11/29 jQuery
详解如何从零开始搭建Express+Vue开发环境
2018/07/17 Javascript
详解操作虚拟dom模拟react视图渲染
2018/07/25 Javascript
React中获取数据的3种方法及优缺点
2020/02/18 Javascript
vue cli3适配所有端方案的实现
2020/04/13 Javascript
将Vue组件库更换为按需加载的方法步骤
2020/05/06 Javascript
[02:35]DOTA2超级联赛专访XB 难忘一年九冠称王
2013/06/20 DOTA
[08:08]DOTA2-DPC中国联赛2月28日Recap集锦
2021/03/11 DOTA
闭包在python中的应用之translate和maketrans用法详解
2014/08/27 Python
Python迭代器定义与简单用法分析
2018/04/30 Python
Python 实现中值滤波、均值滤波的方法
2019/01/09 Python
Python如何通过百度翻译API实现翻译功能
2020/04/02 Python
美国最便宜的旅游网站:CheapTickets
2017/07/09 全球购物
公司廉洁自律承诺书
2014/03/27 职场文书
无传销社区工作方案
2014/05/13 职场文书
餐饮周年庆活动方案
2014/08/14 职场文书
四风查摆问题自查报告
2014/10/10 职场文书
亮剑观后感
2015/06/05 职场文书
手残删除python之后的补救方法
2021/06/26 Python
SpringBoot快速入门详解
2021/07/21 Java/Android