从零开始学习jQuery (二) 万能的选择器


Posted in Javascript onOctober 01, 2010

一.摘要

本章讲解jQuery最重要的选择器部分的知识. 有了jQuery的选择器我们几乎可以获取页面上任意的一个或一组对象, 可以明显减轻开发人员的工作量.

二.前言

编写任何javascript程序我们要首先获得对象, jQuery选择器能彻底改变我们平时获取对象的方式, 可以获取几乎任何语意的对象, 比如"拥有title属性并且值中包含test的<a>元素", 完成这些工作只需要编写一个jQuery选择器字符串. 学习jQuery选择器是学习jQuery最重要的一步.

三.Dom对象和jQuery包装集

无论是在写程序还是看API文档,  我们要时刻注意区分Dom对象和jQuery包装集.

1.Dom对象

在传统的javascript开发中,我们都是首先获取Dom对象,比如:

var div = document.getElementById("testDiv"); 
var divs = document.getElementsByTagName("div");

我们经常使用 document.getElementById 方法根据id获取单个Dom对象, 或者使用 document.getElementsByTagName 方法根据HTML标签名称获取Dom对象集合.

另外在事件函数中, 可以通过在方法函数中使用this引用事件触发对象(但是在多播事件函数中IE6存在问题), 或者使用event对象的target(FF)或srcElement(iIE6)获取到引发事件的Dom对象.

注意我们这里获取到的都是Dom对象, Dom对象也有不同的类型比如input, div, span等.  Dom对象只有有限的属性和方法:

 

八.总结

本章节讲解的jQuery依然属于基础支持, 所以没有太多的应用实例.  虽然基础但是很难一次全部记住, jQuery选择器可以说是最考验一个人jQuery功力的地方. 下一章我们讲解如何操作jQuery包装集以及动态创建新元素.

本章代码下载:/201009/yuanma/Code-jQueryStudy-2.rar
作者:张子秋
出处:http://www.cnblogs.com/zhangziqiu/

Javascript 相关文章推荐
javascript中自定义对象的属性方法分享
Jul 12 Javascript
jQuery内容过滤选择器用法分析
Feb 10 Javascript
JS延时提示框实现方法详解
Nov 26 Javascript
轻松实现js弹框显示选项
Sep 13 Javascript
基于jQuery插件jqzoom实现的图片放大镜效果示例
Jan 23 Javascript
详解vue嵌套路由-query传递参数
May 23 Javascript
在Vue组件上动态添加和删除属性方法
Feb 23 Javascript
如何更好的编写js async函数
May 13 Javascript
JS实现字体背景跑马灯
Jan 06 Javascript
ckeditor一键排版功能实现方法分析
Feb 06 Javascript
JavaScript Event Loop相关原理解析
Jun 10 Javascript
移动端JS实现拖拽两种方法解析
Oct 12 Javascript
fancybox1.3.1 基于Jquery的插件在IE中图片显示问题
Oct 01 #Javascript
客户端 使用XML DOM加载json数据的方法
Sep 28 #Javascript
jquery选择器(常用选择器说明)
Sep 28 #Javascript
Jquey拖拽控件Draggable使用方法(asp.net环境)
Sep 28 #Javascript
基于Jquery的仿Windows Aero弹出窗(漂亮的关闭按钮)
Sep 28 #Javascript
jquery控制listbox中项的移动并排序的实现代码
Sep 28 #Javascript
JQuery UI DatePicker中z-index默认为1的解决办法
Sep 28 #Javascript
You might like
谈谈新手如何学习PHP
2006/12/23 PHP
php输出xml属性的方法
2015/03/19 PHP
PHP模板引擎smarty详细介绍
2015/05/26 PHP
LazyForm jQuery plugin 定制您的CheckBox Radio和Select
2009/10/24 Javascript
基于jQuery的图片剪切插件
2011/08/03 Javascript
js函数参数设置默认值的一种变通实现方法
2014/05/26 Javascript
JavaScript中的replace()方法使用详解
2015/06/06 Javascript
解析ajaxFileUpload 异步上传文件简单使用
2016/12/30 Javascript
React简单介绍
2017/05/24 Javascript
JavaScript模块模式实例详解
2017/10/25 Javascript
在vue中使用css modules替代scroped的方法
2018/03/10 Javascript
在vue组件中使用axios的方法
2018/03/16 Javascript
vue vant Area组件使用详解
2019/12/09 Javascript
uni-app使用countdown插件实现倒计时
2020/11/01 Javascript
[10:18]2018DOTA2国际邀请赛寻真——Fnatic能否笑到最后?
2018/08/14 DOTA
python端口扫描系统实现方法
2014/11/19 Python
在Ubuntu系统下安装使用Python的GUI工具wxPython
2016/02/18 Python
动感网页相册 python编写简单文件夹内图片浏览工具
2016/08/17 Python
正确理解python中的关键字“with”与上下文管理器
2017/04/21 Python
python模块之sys模块和序列化模块(实例讲解)
2017/09/13 Python
python实现感知器
2017/12/19 Python
Python实现iOS自动化打包详解步骤
2018/10/03 Python
Python使用post及get方式提交数据的实例
2019/01/24 Python
Python利用sqlacodegen自动生成ORM实体类示例
2019/06/04 Python
django框架模板中定义变量(set variable in django template)的方法分析
2019/06/24 Python
基于Python解密仿射密码
2019/10/21 Python
matplotlib 多个图像共用一个colorbar的实现示例
2020/09/10 Python
金融事务专业毕业生求职信
2014/02/23 职场文书
中小学生学籍证明
2014/10/25 职场文书
2014年人事专员工作总结
2014/11/19 职场文书
golang中的空接口使用详解
2021/03/30 Python
详解GaussDB for MySQL性能优化
2021/05/18 MySQL
java后台调用接口及处理跨域问题的解决
2022/03/24 Java/Android
Python实现双向链表基本操作
2022/05/25 Python
MySQL选择合适的备份策略和备份工具
2022/06/01 MySQL
vue3 自定义图片放大器效果的示例代码
2022/07/23 Vue.js