jQuery选择器基础入门教程


Posted in Javascript onMay 10, 2016

本文实例讲述了jQuery选择器用法。分享给大家供大家参考,具体如下:

什么是jQuery选择器

使用JavaScript操作页面上得DOM元素时,首先要获取DOM元素。但是原始的javascript只元件根据ID或者TagName获取DOM对象。

在jQuery中则完全不同,jQuery提供了异常强大的选择器用以帮助我们获取页面上的对象,并且将对象以jquery对象的形式返回。

首先来看看什么是选择器。

//根据id获取jQuery对象
var jQueryObject=$("#testDiv");

上例中使用了id选择器,选取id为testDiv的DOM对象并将它放入jQuery对象,最后返回了一个jQuery对象。

现在通过jQueryObject变量就可以操作testDiv图层了,因为jQueryObject是一个jQuery对象,所以可以使用所有的jQuery对象方法。比如修改图层中的HTML内容:

jQueryObject.html("修改后的HTML内容");

通过ID选中元素是最有效率的jQuery选择器。这是因为在原始的javascript中就提供了选中id的方法document.getElementById()。有关选择器的使用技巧将在后面提到。

jQuery选择器的强大在于提供了丰富的选择器,如果使用原始javascript则需要编写很多的代码才能实现。这极大减少了开发人员的工作量。

jQuery选择器核心函数

jQuery选择器调用的是jQuery核心函数:

jQuery(EXPRESSION,[econtext]);

这个函数接收一个包含选择器表达式的字符串,然后用这个字符串去匹配一组元素。

jQuery的核心功能都是通过这个函数实现的。jQuery中的大部分功能都基于这个函数,或者说都是在以某种方式使用这个函数。该函数最基本的用法就是向他传递一个表达式(通常由CSS选择器组成),然后根据这个表达式查找所有匹配的元素。

默认情况下,如果没有指定context参数,$()将在当前的HTML document中查找DOM元素:如果指定了context参数,如一个dom元素集jQuery对象,则会在这个context中查找。在jQuery1.3.2以后,其返回的元素顺序等同于在context中出现的先后顺序。

参数说明如下:

~Expression:必选参数,选择器表达式。

~Context:可选参数,选择器上下文

~jQuery,选择器返回的jQuery对象,jQuery对象,jQuery对象是一个集合,可以使用链式语法调用各种jQuery函数。

Context参数能够缩小选择器的范围,加快查找速度。

希望本文所述对大家jquery程序设计有所帮助。

Javascript 相关文章推荐
splice slice区别
Oct 09 Javascript
javascript之ESC(第二类混淆)
May 06 Javascript
jquery下json数组的操作实现代码
Aug 09 Javascript
两个数组去重的JS代码
Dec 04 Javascript
JavaScript直播评论发弹幕切图功能点集合效果代码
Jun 26 Javascript
javascript类型系统——日期Date对象全面了解
Jul 13 Javascript
关于jquery中动态增加select,事件无效的快速解决方法
Aug 29 Javascript
jstree的简单实例
Dec 01 Javascript
完美解决浏览器跨域的几种方法(汇总)
May 08 Javascript
javascript中toFixed()四舍五入使用方法详解
Sep 28 Javascript
微信小程序自定义弹窗滚动与页面滚动冲突的解决方法
Jul 16 Javascript
解决vue.js提交数组时出现数组下标的问题
Nov 05 Javascript
jquery实现图片上传前本地预览功能
May 10 #Javascript
基于JQuery的$.ajax方法进行异步请求导致页面闪烁的解决办法
May 10 #Javascript
基于jquery实现三级下拉菜单
May 10 #Javascript
jQuery Dialog对话框事件用法实例分析
May 10 #Javascript
bootstrap网页框架的使用方法
May 10 #Javascript
浅析Bootstrip的select控件绑定数据的问题
May 10 #Javascript
jQuery的文档处理程序详解
May 10 #Javascript
You might like
PHP 应用程序的安全 -- 不能违反的四条安全规则
2006/11/26 PHP
php采集内容中带有图片地址的远程图片并保存的方法
2015/01/03 PHP
Thinkphp调用Image类生成缩略图的方法
2015/03/07 PHP
css图片自适应大小
2007/11/28 Javascript
JavaScrip实现PHP print_r的数功能(三种方法)
2013/11/12 Javascript
div浮层,滚动条移动,位置保持不变的4种方法汇总
2013/12/11 Javascript
原生js和jQuery写的网页选项卡特效对比
2015/04/27 Javascript
浅谈JavaScript 的执行顺序
2015/08/07 Javascript
JavaScript预解析及相关技巧分析
2016/04/21 Javascript
浅谈JavaScript 执行环境、作用域及垃圾回收
2016/05/31 Javascript
微信小程序通过api接口将json数据展现到小程序示例
2017/01/20 Javascript
深究AngularJS如何获取input的焦点(自定义指令)
2017/06/12 Javascript
JS实现的合并多个数组去重算法示例
2018/04/11 Javascript
MVVM 双向绑定的实现代码
2018/06/21 Javascript
使用vue根据状态添加列表数据和删除列表数据的实例
2018/09/29 Javascript
JS实现的雪花飘落特效示例
2019/12/03 Javascript
javascript单张多张图无缝滚动实例代码
2020/05/10 Javascript
elementui更改el-dialog关闭按钮的图标d的示例代码
2020/08/04 Javascript
浅谈JavaScript节流和防抖函数
2020/08/25 Javascript
vue 实现click同时传入事件对象和自定义参数
2021/01/29 Vue.js
[58:54]EG vs RNG 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/18 DOTA
linux系统使用python获取cpu信息脚本分享
2014/01/15 Python
Python实现端口复用实例代码
2014/07/03 Python
python实现堆栈与队列的方法
2015/01/15 Python
Python实现TCP/IP协议下的端口转发及重定向示例
2016/06/14 Python
Python numpy 提取矩阵的某一行或某一列的实例
2018/04/03 Python
Django框架封装外部函数示例
2019/05/28 Python
Europcar意大利:汽车租赁
2019/07/07 全球购物
大学生就业自我鉴定
2013/10/26 职场文书
会计助理岗位职责
2014/02/17 职场文书
美术教学感言
2014/02/22 职场文书
理工大学毕业生自荐信范文
2014/02/22 职场文书
企业安全生产月活动总结
2014/07/05 职场文书
公司备用金管理制度
2015/08/04 职场文书
导游词之新疆-喀纳斯
2019/10/10 职场文书
JavaWeb 入门篇(3)ServletContext 详解 具体应用
2021/07/16 Java/Android