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 相关文章推荐
JQuery Tips(4) 一些关于提高JQuery性能的Tips
Dec 19 Javascript
javascript showModalDialog模态对话框使用说明
Dec 31 Javascript
JavaScript实现基于Cookie的存储类实例
Apr 10 Javascript
分享几种比较简单实用的JavaScript tabel切换
Dec 31 Javascript
AngularJS入门(用ng-repeat指令实现循环输出
May 05 Javascript
详解vue-router2.0动态路由获取参数
Jun 14 Javascript
JavaScript 下载svg图片为png格式
Jun 21 Javascript
JavaScript解决浮点数计算不准确问题的方法分析
Jul 09 Javascript
H5+C3+JS实现双人对战五子棋游戏(UI篇)
May 28 Javascript
详解如何在JS代码中消灭for循环
Dec 11 Javascript
vue自定义标签和单页面多路由的实现代码
May 03 Javascript
JS+CSS实现炫酷光感效果
Sep 05 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
如何冲泡挂耳包咖啡?技巧是什么
2021/03/04 冲泡冲煮
php中字符串和正则表达式详解
2014/10/23 PHP
PHP实现求解最长公共子串问题的方法
2017/11/17 PHP
pjblog中的UBBCode.js
2007/04/25 Javascript
document.documentElement &amp;&amp; document.documentElement.scrollTop
2007/12/01 Javascript
javascript中&quot;/&quot;运算符常见错误
2010/10/13 Javascript
JS实现div内部的文字或图片自动循环滚动代码
2013/04/19 Javascript
JS动态调用方法名示例介绍
2013/12/18 Javascript
jQuery插件scroll实现无缝滚动效果
2015/04/27 Javascript
完美解决jQuery符号$与其他javascript 库、框架冲突的问题
2016/08/09 Javascript
基于hover的用法实例(推荐)
2017/07/04 Javascript
解决低版本的浏览器不支持es6的import问题
2018/03/09 Javascript
详解Vue.js中.native修饰符
2018/04/24 Javascript
vue根据进入的路由进行原路返回的方法
2018/09/26 Javascript
使用easyui从servlet传递json数据到前端页面的两种方法
2019/09/05 Javascript
Vue 自定义指令实现一键 Copy功能
2019/09/16 Javascript
vue3修改link标签默认icon无效问题详解
2019/10/09 Javascript
微信小程序自定义菜单切换栏tabbar组件代码实例
2019/12/30 Javascript
JavaScript数组去重实现方法小结
2020/01/17 Javascript
微信小程序学习总结(四)事件与冒泡实例分析
2020/06/04 Javascript
解决vue动态路由异步加载import组件,加载不到module的问题
2020/07/26 Javascript
详解微信小程序(Taro)手动埋点和自动埋点的实现
2021/03/02 Javascript
python搭建微信公众平台
2016/02/09 Python
详解tensorflow载入数据的三种方式
2018/04/24 Python
python实现画五角星和螺旋线的示例
2019/01/20 Python
Python使用微信接入图灵机器人过程解析
2019/11/04 Python
Python txt文件常用读写操作代码实例
2020/08/03 Python
python中zip()函数遍历多个列表方法
2021/02/18 Python
纯CSS3实现的井字棋游戏
2020/11/25 HTML / CSS
机械设计毕业生自荐信
2014/02/02 职场文书
处级干部考察材料
2014/12/24 职场文书
中学生社会实践教育活动总结
2015/05/06 职场文书
法律意见书范文
2015/05/20 职场文书
董事长致辞
2015/07/29 职场文书
彻底理解golang中什么是nil
2021/04/29 Golang
python接口测试返回数据为字典取值方式
2022/02/12 Python