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动态创建表格,删除行列的小例子
Jul 20 Javascript
高性能JavaScript模板引擎实现原理详解
Feb 05 Javascript
javascript中mouseover、mouseout使用详解
Jul 19 Javascript
asp.net中oracle 存储过程(图文)
Aug 12 Javascript
JavaScript判断对象是否为数组
Dec 22 Javascript
javascript中闭包概念与用法深入理解
Dec 15 Javascript
初识 Vue.js 中的 *.Vue文件
Nov 22 Javascript
对layui中表单元素的使用详解
Aug 15 Javascript
Vue.set() this.$set()引发的视图更新思考及注意事项
Aug 30 Javascript
vuex直接赋值的三种方法总结
Sep 16 Javascript
vue-cli 3 全局过滤器的实例代码详解
Jun 03 Javascript
js实现无限瀑布流实例方法
Sep 16 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简单实现发送带附件的邮件
2015/06/10 PHP
JavaScript高级程序设计 错误处理与调试学习笔记
2011/09/10 Javascript
JQuery中使用Ajax赋值给全局变量异常的解决方法
2014/01/10 Javascript
jquery $.trim()去除字符串空格的实现方法【附图例】
2016/03/30 Javascript
早该知道的7个JavaScript技巧
2016/06/21 Javascript
原生js实现tab选项卡切换
2020/03/23 Javascript
js在ie下打开对话窗口的方法小结
2016/10/24 Javascript
利用jQuery.Validate异步验证用户名是否存在(推荐)
2016/12/09 Javascript
微信小程序--组件(swiper)详细介绍
2017/06/13 Javascript
js 索引下标之li集合绑定点击事件
2018/01/12 Javascript
vue项目中使用Hbuilder打包app 设置沉浸式状态栏的方法
2018/10/22 Javascript
利用Vconsole和Fillder进行移动端抓包调试方法
2019/03/05 Javascript
浅谈vue在html中出现{{}}的原因及解决方式
2020/11/16 Javascript
[00:02]DOTA2新版本使用PA至宝后暴击展示
2014/11/19 DOTA
Python提示[Errno 32]Broken pipe导致线程crash错误解决方法
2014/11/19 Python
详解python中的线程
2018/02/10 Python
Tensorflow使用tfrecord输入数据格式
2018/06/19 Python
PyCharm设置SSH远程调试的方法
2018/07/17 Python
Flask框架WTForm表单用法示例
2018/07/20 Python
Windows下Python3.6安装第三方模块的方法
2018/11/22 Python
python实现网页自动签到功能
2019/01/21 Python
详解python项目实战:模拟登陆CSDN
2019/04/04 Python
Python+threading模块对单个接口进行并发测试
2019/06/25 Python
python__new__内置静态方法使用解析
2020/01/07 Python
python中pdb模块实例用法
2021/01/15 Python
CSS3 media queries + jQuery实现响应式导航
2016/09/30 HTML / CSS
CSS3 input框的实现代码类似Google登录的动画效果
2020/08/04 HTML / CSS
来自全球大都市的高级街头服饰:Pegador
2018/01/03 全球购物
忠诚教育心得体会
2014/09/03 职场文书
任命书格式范文
2015/09/22 职场文书
周一给客户的问候语
2015/11/10 职场文书
小学生大队委竞选稿
2015/11/20 职场文书
2019年销售部季度工作计划3篇
2019/10/09 职场文书
Python基础之函数嵌套知识总结
2021/05/23 Python
关于EntityWrapper的in用法
2022/03/22 Java/Android
ECharts transform数据转换和dataZoom在项目中使用
2022/12/24 Javascript