JQuery中$之选择器用法介绍


Posted in Javascript onApril 05, 2011

1.$。在jQuery 中$("<span>"),这个语法等同于$(document.createElement("span")) ,这是一种用法,在选择元素的时候还会这样子的用:[attribute$=value],匹配给定的属性是以某些值结尾的元素。下面举个例子来说明一下:
HTML代码
<input name="newsletter" />
<input name="milkman" />
<input name="jobletter" />
jQuery 代码:
$("input[name$='letter']")
结果:
[ <input name="newsletter" />, <input name="jobletter" /> ]
2.!。选择器:[attribute!=value],匹配所有不含有指定的属性,或者属性不等于特定值的元素,此选择器等价于:not([attr=value])。
例子说明一下:
HTML代码
<input type="checkbox" name="newsletter" value="Hot Fuzz" />
<input type="checkbox" name="newsletter" value="Cold Fusion" />
<input type="checkbox" name="accept" value="Evil Plans" />
jQuery 代码:
$("input[name!='newsletter']").attr("checked", true);
结果:
[ <input type="checkbox" name="accept" value="Evil Plans" checked="true" /> ]
3.*。选择器:[attribute*=value],匹配给定的属性是以包含某些值的元素。举个例子说明一下:
HTML 代码:
<input name="man-news" />
<input name="milkman" />
<input name="letterman2" />
<input name="newmilk" />
jQuery 代码:
$("input[name*='man']")
结果:
[ <input name="man-news" />, <input name="milkman" />, <input name="letterman2" /> ]
4.@。匹配包含给定属性的元素。注意,在jQuery 1.3中,前导的@符号已经被废除!如果想要兼容最新版本,只需要简单去掉@符号即
可。
5.^。选择器:[attribute^=value],匹配给定的属性是以某些值开始的元素,下面举个例子来说明一下:
HTML 代码:
<input name="newsletter" />
<input name="milkman" />
<input name="newsboy" />
jQuery 代码:
$("input[name^='news']")
结果:
[ <input name="newsletter" />, <input name="newsboy" /> ]

在jquery中,当使用$("input[name='metaId']“).val()不能直接获得被选择的radio的值,只是获得 radio标签的第一个值,这可能jquery使用xpath语言了进行查找有关,而我们通常是想获得被选中的radio的值,有以下几种方法:
1,使用$("input[name='metaId']:checked").val()获得 //name代表radio中name属性名
2,使用$(":radio:checked").val()获得 //限制页面只有一组radio标签

Javascript 相关文章推荐
JS去掉第一个字符和最后一个字符的实现代码
Feb 20 Javascript
JavaScript中的fontsize()方法使用详解
Jun 08 Javascript
JavaScript清空数组元素的两种方法简单比较
Jul 10 Javascript
常用的js验证和数据处理总结
Aug 02 Javascript
Vuejs第十一篇组件之slot内容分发实例详解
Sep 09 Javascript
更靠谱的H5横竖屏检测方法(js代码)
Sep 13 Javascript
WebView启动支付宝客户端支付失败的问题小结
Jan 11 Javascript
JavaScript数据结构之二叉树的遍历算法示例
Apr 13 Javascript
jQuery树插件zTree使用方法详解
May 02 jQuery
详解Vue的computed(计算属性)使用实例之TodoList
Aug 07 Javascript
web前端开发中常见的多列布局解决方案整理(一定要看)
Oct 15 Javascript
Vue3.x源码调试的实现方法
Oct 13 Javascript
关于window.pageYOffset和document.documentElement.scrollTop
Apr 05 #Javascript
Javascript 自适应高度的Tab选项卡
Apr 05 #Javascript
Ajax 数据请求的简单分析
Apr 05 #Javascript
jQuery1.5.1 animate方法源码阅读
Apr 05 #Javascript
jQuery的运行机制和设计理念分析
Apr 05 #Javascript
jQuery JSON的解析方式分享
Apr 05 #Javascript
jQuery 1.5 源码解读 面向中高阶JSER
Apr 05 #Javascript
You might like
推荐一篇入门级的Class文章
2007/03/19 PHP
初步介绍PHP扩展开发经验分享
2012/09/06 PHP
Laravel中任务调度console使用方法小结
2017/05/07 PHP
用js计算页面执行时间的函数
2006/12/07 Javascript
JQuery文本框高亮显示插件代码
2011/04/02 Javascript
JQuery 控制内容长度超出规定长度显示省略号
2014/05/23 Javascript
JavaScript生成的动态下雨背景效果实现方法
2015/02/25 Javascript
纯JavaScript实现的分页插件实例
2015/07/14 Javascript
ArtEditor富文本编辑器增加表单提交功能
2016/04/18 Javascript
Javascript必知必会(四)js类型转换
2016/06/08 Javascript
webstorm中配置nodejs环境及npm的实例
2018/05/15 NodeJs
node错误处理与日志记录的实现
2018/12/24 Javascript
在微信小程序中使用图表的方法示例
2019/04/25 Javascript
关于layui的下拉搜索框异步加载数据的解决方法
2019/09/28 Javascript
vuejs中父子组件之间通信方法实例详解
2020/01/17 Javascript
vue+iview实现分页及查询功能
2020/11/17 Vue.js
在Python中用split()方法分割字符串的使用介绍
2015/05/20 Python
Python编程实现数学运算求一元二次方程的实根算法示例
2017/04/02 Python
python 读取文件并把矩阵转成numpy的两种方法
2019/02/12 Python
实例讲解Python中整数的最大值输出
2019/03/17 Python
Python函数基础实例详解【函数嵌套,命名空间,函数对象,闭包函数等】
2019/03/30 Python
python实现飞机大战项目
2020/03/11 Python
Python读取多列数据以及用matplotlib制作图表方法实例
2020/09/23 Python
Numpy ndarray 多维数组对象的使用
2021/02/10 Python
HTML5 canvas基本绘图之文字渲染
2016/06/27 HTML / CSS
详解html5 canvas常用api总结(二)--绘图API
2016/12/14 HTML / CSS
UGG雪地靴荷兰官网:UGG荷兰
2016/09/09 全球购物
Jabra捷波朗美国官网:用于办公、车载和运动的无线蓝牙耳麦
2017/02/01 全球购物
好药师网上药店:安全合法的网上药品零售药房
2017/02/15 全球购物
Lookfantastic法国官网:英国知名美妆购物网站
2017/10/28 全球购物
北美Newegg打造的全球尖货海购平台:tt海购
2018/09/28 全球购物
什么是smarty? Smarty的优点是什么?
2013/08/11 面试题
宿舍违规检讨书
2014/01/12 职场文书
科长竞聘演讲稿
2014/05/16 职场文书
CSS 还能这样玩?奇思妙想渐变的艺术
2021/04/27 HTML / CSS
Redis Lua脚本实现ip限流示例
2022/07/15 Redis