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 相关文章推荐
jquery dialog键盘事件代码
Aug 01 Javascript
Jquery实现侧边栏跟随滚动条固定(兼容IE6)
Apr 02 Javascript
jquery动态添加元素事件失效问题解决方法
May 23 Javascript
JavaScript中匿名、命名函数的性能测试
Sep 04 Javascript
jquery插件推荐 jquery.cookie
Nov 09 Javascript
javascript的tab切换原理与效果实现方法
Jan 10 Javascript
jQuery事件绑定与解除绑定实现方法
Apr 15 Javascript
JS+CSS3模拟溢出滚动效果
Aug 12 Javascript
详解Javascript ES6中的箭头函数(Arrow Functions)
Aug 24 Javascript
jQuery点击页面其他部分隐藏下拉菜单功能
Nov 27 jQuery
jQuery使用$.extend(true,object1, object2);实现深拷贝对象的方法分析
Mar 06 jQuery
页面内锚点定位及跳转方法总结(推荐)
Apr 24 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
有关php运算符的知识大全
2011/11/03 PHP
thinkphp3.x连接mysql数据库的方法(具体操作步骤)
2016/05/19 PHP
Thinkphp5.0 框架实现控制器向视图view赋值及视图view取值操作示例
2019/10/12 PHP
如何书写高质量jQuery代码(使用jquery性能问题)
2014/06/30 Javascript
基于javascript的COOkie的操作实现只能点一次
2014/12/26 Javascript
jquery插件jquery.nicescroll实现图片无滚动条左右拖拽的方法
2015/08/10 Javascript
基于jquery实现图片上传本地预览功能
2016/01/08 Javascript
BootStrapTable服务器分页实例解析
2016/12/20 Javascript
Vue.js数据绑定之data属性
2017/07/07 Javascript
用JS实现简单的登录验证功能
2017/07/28 Javascript
js数字滑动时钟的简单实现(示例讲解)
2017/08/14 Javascript
解决vue中无法动态修改jqgrid组件 url地址的问题
2018/03/01 Javascript
JS对象与json字符串相互转换实现方法示例
2018/06/14 Javascript
python基础教程之实现石头剪刀布游戏示例
2014/02/11 Python
Python计算回文数的方法
2015/03/11 Python
python将文本转换成图片输出的方法
2015/04/28 Python
Python找出list中最常出现元素的方法
2016/06/14 Python
Python+selenium 获取浏览器窗口坐标、句柄的方法
2018/10/14 Python
PyGame贪吃蛇的实现代码示例
2018/11/21 Python
对Python信号处理模块signal详解
2019/01/09 Python
Django通过dwebsocket实现websocket的例子
2019/11/15 Python
使用pyecharts1.7进行简单的可视化大全
2020/05/17 Python
django中related_name的用法说明
2020/05/20 Python
CSS3 linear-gradient线性渐变生成加号和减号的方法
2017/11/21 HTML / CSS
加利福尼亚州威尼斯的女性奢侈品设计师服装和概念店:Mona Moore
2018/09/13 全球购物
澳大利亚最大的百货公司:Myer
2018/12/21 全球购物
个人党性剖析材料
2014/02/03 职场文书
安全生产先进个人材料
2014/02/06 职场文书
总会计师岗位职责
2014/02/19 职场文书
力学专业求职信
2014/07/23 职场文书
2014年高中班主任工作总结
2014/11/08 职场文书
公司离职证明标准格式
2014/11/18 职场文书
社区义诊通知
2015/04/24 职场文书
学风建设主题班会
2015/08/17 职场文书
奇妙的 CSS shapes(CSS图形)
2021/04/05 HTML / CSS
Java面试题冲刺第十九天--数据库(4)
2021/08/07 Java/Android