jQuery函数的第二个参数获取指定上下文中的DOM元素


Posted in Javascript onMay 19, 2014

jQuery函数的第二个参数可以指定DOM元素的搜索范围。

第二个参数可分为以下类型

DOM reference
jQuery wrapper
document

代码示例

<!DOCTYPE html> 
<html> 
<body> 
<form> 
<input name="" type="checkbox"/> 
<input name="" type="radio"/> 
<input name="" type="text"/> 
<input name="" type="button"/> 
</form> 
<form> 
<input name="" type="checkbox"/> 
<input name="" type="radio"/> 
<input name="" type="text"/> 
<input name="" type="button"/> 
</form> 
<input name="" type="checkbox"/> 
<input name="" type="radio"/> 
<input name="" type="text"/> 
<input name="" type="button"/> <script type="text/javascript" src="jquery-1.11.1.js"></script> 
<script type="text/javascript"> 
// search within all form elements, using a wrapper for context, 
// alerts "8 inputs" 
alert("selected" + $('input', $('form')).length + ' inputs'); 
// search with the first form element, using DOM reference as the context, 
// alerts "4 inputs" 
alert("selected" + $('input', document.forms[0]).length + ' inputs'); 
// search within the body element for all input elements using an expression, 
// alerts "12 inputs" 
alert("selected" + $('input', 'body').length + ' inputs'); 
</script> 
</body> 
</html>

总结

第二个参数的不同的类型,对应的用法如下表所示。

类型 用法
jQuery wrapper $('input', $('form')).length
DOM reference $('input', document.forms[0]).length
document $('input', 'body').length
Javascript 相关文章推荐
aspx中利用js实现确认删除代码
Jul 22 Javascript
返回上一页并自动刷新的JavaScript代码
Feb 19 Javascript
判断iframe里的页面是否加载完成
Jun 06 Javascript
基于JavaScript操作DOM常用的API小结
Dec 01 Javascript
javascript数据类型验证方法
Dec 31 Javascript
基于canvas实现的钟摆效果完整实例
Jan 26 Javascript
JS原型链 详解及示例代码
Sep 06 Javascript
canvas实现探照灯效果
Feb 07 Javascript
jQuery操作元素追加内容示例
Jan 10 jQuery
Vue中qs插件的使用详解
Feb 07 Javascript
解决vue-loader加载不上的问题
Oct 21 Javascript
Vue全局使用less样式,组件使用全局样式文件中定义的变量操作
Oct 21 Javascript
jQuery filter函数使用方法
May 19 #Javascript
用js模拟struts2的多action调用示例
May 19 #Javascript
从零学JS之你需要了解的几本书
May 19 #Javascript
JavaScript在IE和FF下的兼容性问题
May 19 #Javascript
从零学JSON之JSON数据结构
May 19 #Javascript
jquery 选取方法都有哪些
May 18 #Javascript
jquery中获得元素尺寸和坐标的方法整理
May 18 #Javascript
You might like
浅析php中三个等号(===)和两个等号(==)的区别
2013/08/06 PHP
PHP模板引擎Smarty的缓存使用总结
2014/04/24 PHP
PHP、Java des加密解密实例
2015/04/27 PHP
php实现表单多按钮提交action的处理方法
2015/10/24 PHP
利用PHP将图片转换成base64编码的实现方法
2016/09/13 PHP
laravel中的fillable和guarded属性详解
2019/10/23 PHP
php设计模式之享元模式分析【星际争霸游戏案例】
2020/03/23 PHP
基于jquery的图片懒加载js
2010/06/30 Javascript
javascript客户端解决方案 缓存提供程序
2010/07/14 Javascript
基于jQuery的弹出框插件
2012/03/18 Javascript
用jquery存取照片的具体实现方法
2013/06/30 Javascript
jquery实现对联广告的方法
2015/02/05 Javascript
Jquery中巧用Ajax的beforeSend方法
2016/01/20 Javascript
node.js连接mongoDB数据库 快速搭建自己的web服务
2016/04/17 Javascript
用JS中split方法实现彩色文字背景效果实例
2016/08/24 Javascript
ionic4+angular7+cordova上传图片功能的实例代码
2019/06/19 Javascript
微信小程序登录对接Django后端实现JWT方式验证登录详解
2019/07/29 Javascript
Element-UI中关于table表格的那些骚操作(小结)
2019/08/15 Javascript
vue 封装 Adminlte3组件的实现
2020/03/18 Javascript
JS实现进度条动态加载特效
2020/03/25 Javascript
python中异常报错处理方法汇总
2016/11/20 Python
python构建自定义回调函数详解
2017/06/20 Python
Python3实现发送QQ邮件功能(html)
2017/12/15 Python
详解Django 中是否使用时区的区别
2018/06/14 Python
Django 登陆验证码和中间件的实现
2018/08/17 Python
如何更改 pandas dataframe 中两列的位置
2019/12/27 Python
python实现学生成绩测评系统
2020/06/22 Python
Python中使用Selenium环境安装的方法步骤
2021/02/22 Python
世界上最好的旅行夹克:BauBax
2018/12/23 全球购物
趣天网日本站:Qoo10 JP
2019/09/18 全球购物
瑞典多品牌连锁店:Johnells
2021/01/13 全球购物
实习自我鉴定
2013/12/15 职场文书
创业计划书的写作技巧及要点
2014/01/31 职场文书
社区优秀志愿者材料
2014/02/02 职场文书
医药公司采购员岗位职责
2014/09/12 职场文书
Redis基本数据类型String常用操作命令
2022/06/01 Redis