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 放大镜效果js组件 qsoft.PopBigImage.v0.35 加入了chrome支持
Apr 07 Javascript
jQuery Ajax文件上传(php)
Jun 16 Javascript
javascript图片相似度算法实现 js实现直方图和向量算法
Jan 14 Javascript
调试代码导致IE出错的避免方法
Apr 04 Javascript
js拼接html注意问题示例探讨
Jul 14 Javascript
jquery提示效果实例分析
Nov 25 Javascript
Node.js重新刷新session过期时间的方法
Feb 04 Javascript
Angular ng-repeat指令实例以及扩展部分
Dec 26 Javascript
详解Angular路由 ng-route和ui-router的区别
May 22 Javascript
JavaScript函数的特性与应用实践深入详解
Dec 30 Javascript
ES6入门教程之Array.from()方法
Mar 23 Javascript
用webpack4开发小程序的实现方法
Jun 04 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
ajax+php控制所有后台函数调用
2015/07/15 PHP
4种PHP异步执行的常用方式
2015/12/24 PHP
php中Swoole的热更新实现代码实例
2021/03/04 PHP
javascript编程起步(第三课)
2007/02/27 Javascript
六款帮助你实现惊艳视差滚动效果的jQuery插件
2012/09/14 Javascript
纯js代码实现未知宽高的元素在指定元素中垂直水平居中显示
2015/09/12 Javascript
json实现添加、遍历与删除属性的方法
2016/06/17 Javascript
Knockout结合Bootstrap创建动态UI实现产品列表管理
2016/09/14 Javascript
微信小程序 wxapp地图 map详解
2016/10/31 Javascript
JavaScript基础心法 深浅拷贝(浅拷贝和深拷贝)
2018/03/05 Javascript
基于Koa2写个脚手架模拟接口服务的方法
2018/11/27 Javascript
在移动端使用vue-router和keep-alive的方法示例
2018/12/02 Javascript
vue项目打包上传github并制作预览链接(pages)
2019/04/19 Javascript
深入学习JavaScript 高阶函数
2019/06/11 Javascript
python 获取文件列表(或是目录例表)
2009/03/25 Python
python求crc32值的方法
2014/10/05 Python
python自然语言编码转换模块codecs介绍
2015/04/08 Python
Python自动生产表情包
2017/03/17 Python
Python栈算法的实现与简单应用示例
2017/11/01 Python
python通过百度地图API获取某地址的经纬度详解
2018/01/28 Python
python实时监控cpu小工具
2018/06/21 Python
Python面向对象思想与应用入门教程【类与对象】
2019/04/12 Python
django项目环境搭建及在虚拟机本地创建django项目的教程
2019/08/02 Python
ansible动态Inventory主机清单配置遇到的坑
2020/01/19 Python
keras 解决加载lstm+crf模型出错的问题
2020/06/10 Python
如何通过命令行进入python
2020/07/06 Python
构造方法和其他方法的区别?怎么调用父类的构造方法
2013/09/22 面试题
市场营销方案范文
2014/03/11 职场文书
经典广告词大全
2014/03/14 职场文书
委托书样本
2014/04/02 职场文书
竞选班委演讲稿
2014/04/28 职场文书
爱心捐款感谢信
2015/01/20 职场文书
2016年寒假见闻
2015/10/10 职场文书
实例讲解Python中sys.argv[]的用法
2021/06/03 Python
Vue如何清空对象
2022/03/03 Vue.js
【海涛教你打DOTA】黑鸟第一视角解说
2022/04/01 DOTA