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 相关文章推荐
跟随鼠标旋转的文字
Nov 30 Javascript
Moment.js 不容错过的超棒Javascript日期处理类库
Apr 15 Javascript
JavaScript代码简单实现求杨辉三角给定行的最大值
Oct 29 Javascript
用js控制组织结构图可以任意拖拽到指定位置
Jan 17 Javascript
Jquery 返回json数据在IE浏览器中提示下载的问题
May 18 Javascript
向JavaScript的数组中添加元素的方法小结
Oct 24 Javascript
Bootstrap 网站实例之单页营销网站
Oct 20 Javascript
利用js来实现缩略语列表、文献来源链接和快捷键列表
Dec 16 Javascript
简单理解js的冒泡排序
Dec 19 Javascript
JS实现把一个页面层数据传递到另一个页面的两种方式
Aug 13 Javascript
JS开发自己的类库实例分析
Aug 28 Javascript
简单了解JavaScript弹窗实现代码
May 07 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
人族 TERRAN 概述
2020/03/14 星际争霸
PHP错误机制知识汇总
2016/03/24 PHP
PHP之十六个魔术方法详细介绍
2016/11/01 PHP
零基础学JavaScript最新动画教程+iso光盘下载
2008/01/22 Javascript
提高网站信任度的技巧
2008/10/17 Javascript
JavaScript 大数据相加的问题
2011/08/03 Javascript
原生JS实现表单checkbook获取已选择的值
2013/07/21 Javascript
jQuery实现渐变下拉菜单的简单方法
2015/03/11 Javascript
jQuery选择器源码解读(五):tokenize的解析过程
2015/03/31 Javascript
JavaScript中String.prototype用法实例
2015/05/20 Javascript
JS+CSS实现DIV层的展开、收缩效果
2016/01/28 Javascript
js+css实现回到顶部按钮(back to top)
2016/03/02 Javascript
AngularJs bootstrap搭载前台框架——基础页面
2016/09/01 Javascript
基于jQuery实现Accordion手风琴自定义插件
2020/10/13 Javascript
AngularJS 监听变量变化的实现方法
2018/10/09 Javascript
js实现表格单列按字母排序
2020/08/12 Javascript
JavaScript实现矩形块大小任意缩放
2020/08/25 Javascript
ant-design-vue 时间选择器赋值默认时间的操作
2020/10/27 Javascript
[01:13]2014DOTA2西雅图邀请赛 舌尖上的TI4
2014/07/08 DOTA
Python json模块使用实例
2015/04/11 Python
cmd运行python文件时对结果进行保存的方法
2018/05/16 Python
django用户登录和注销的实现方法
2018/07/16 Python
scrapy-redis的安装部署步骤讲解
2019/02/27 Python
基于python实现自动化办公学习笔记(CSV、word、Excel、PPT)
2019/08/06 Python
python 类之间的参数传递方式
2019/12/20 Python
Python转换itertools.chain对象为数组的方法
2020/02/07 Python
三步解决python PermissionError: [WinError 5]拒绝访问的情况
2020/04/22 Python
基于pytorch中的Sequential用法说明
2020/06/24 Python
Python如何合并多个字典或映射
2020/07/24 Python
python excel多行合并的方法
2020/12/09 Python
乡镇总工会学雷锋活动总结
2014/03/01 职场文书
小学三八妇女节活动方案
2014/03/16 职场文书
学生会辞职信
2015/03/02 职场文书
教育读书笔记
2015/07/02 职场文书
python批量创建变量并赋值操作
2021/06/03 Python
pd.drop_duplicates删除重复行的方法实现
2022/06/16 Python