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 相关文章推荐
javascript实现的网页局布刷新效果
Dec 01 Javascript
JavaScript中for-in遍历方式示例介绍
Feb 11 Javascript
深入分析jsonp协议原理
Sep 26 Javascript
纯前端JavaScript实现Excel IO案例分享
Aug 26 Javascript
工作中常用的js、jquery自定义扩展函数代码片段汇总
Dec 22 Javascript
jQuery Json数据格式排版高亮插件json-viewer.js使用方法详解
Jun 12 jQuery
Angular中使用MathJax遇到的一些问题
Dec 15 Javascript
element-ui 设置菜单栏展开的方法
Aug 22 Javascript
vue打包使用Nginx代理解决跨域问题
Aug 27 Javascript
JavaScript实现的九种排序算法
Mar 04 Javascript
JavaScript中常用的简洁高级技巧总结
Mar 10 Javascript
微信小程序BindTap快速连续点击目标页面跳转多次问题处理
Apr 08 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中对各种加密算法、Hash算法的速度测试对比代码
2014/07/08 PHP
php计算到指定日期还有多少天的方法
2015/04/14 PHP
thinkPHP5.1框架中Request类四种调用方式示例
2019/08/03 PHP
js 调用本地exe的例子(支持IE内核的浏览器)
2012/12/26 Javascript
使用js在页面中绘制表格核心代码
2013/09/16 Javascript
js 时间格式与时间戳的相互转换示例代码
2013/12/25 Javascript
3个可以改善用户体验的AngularJS指令介绍
2015/06/18 Javascript
jQuery实现带有动画效果的回到顶部和底部代码
2015/11/04 Javascript
仅30行代码实现Javascript中的MVC
2016/02/15 Javascript
jQuery siblings()用法实例详解
2016/04/26 Javascript
Vue2实现组件props双向绑定
2016/12/02 Javascript
Mac 安装 nodejs方法(图文详细步骤)
2017/10/30 NodeJs
JS实现判断图片是否加载完成的方法分析
2018/07/31 Javascript
原生js实现轮播图特效
2020/05/04 Javascript
python连接池实现示例程序
2013/11/26 Python
浅谈Python的Django框架中的缓存控制
2015/07/24 Python
以视频爬取实例讲解Python爬虫神器Beautiful Soup用法
2016/01/20 Python
python list排序的两种方法及实例讲解
2017/03/20 Python
python深度优先搜索和广度优先搜索
2018/02/07 Python
virtualenv 指定 python 解释器的版本方法
2018/10/25 Python
浅谈python的输入输出,注释,基本数据类型
2019/04/02 Python
pyqt 多窗口之间的相互调用方法
2019/06/19 Python
python处理document文档保留原样式
2019/09/23 Python
Python 面向对象部分知识点小结
2020/03/09 Python
完美解决TensorFlow和Keras大数据量内存溢出的问题
2020/07/03 Python
iHerb香港:维生素、补充剂和天然保健品
2017/08/01 全球购物
Simons官方网站:加拿大时尚零售商
2020/02/20 全球购物
Timberland俄罗斯官方网上商店:全球领先的户外品牌
2020/03/15 全球购物
个人求职简历的自我评价
2013/10/19 职场文书
公务员总结性个人自我评价
2013/12/05 职场文书
风险评估实施方案
2014/03/09 职场文书
英语教师岗位职责
2014/03/16 职场文书
市场部经理岗位职责
2014/04/10 职场文书
廉洁校园实施方案
2014/05/25 职场文书
windows安装python超详细图文教程
2021/05/21 Python
python之PySide2安装使用及QT Designer UI设计案例教程
2021/07/26 Python