jQuery 核心函数以及jQuery对象


Posted in Javascript onMarch 23, 2010

一、jQuery 核心函数

首先介绍 jQuery 的几个核心函数,在 jQuery 中它们起着至关重要的作用,在实际的前端开发过程中用到最多的也是它们。
1、jQuery(elements)

将一个或多个DOM元素转化为jQuery对象。

这个函数也可以接收XML文档和Window对象(虽然它们不是DOM元素)作为有效的参数。

返回值:jQuery 对象

参数

elements:

用于封装成 jQuery 对象的 DOM 元素

// 将当前页面的背景色设为黑色 
jQuery(document.body).css( "background-color", "black" ); 
再看以下代码 
// 将当前页面的背景色设为黑色 
$(document.body).css( "background-color", "black" ); 

代码也可以正常运行,并且执行的效果跟前面的代码一致;那么这儿的 $ 和前面的 jQuery 标识符到底有什么关系呢? 

打开 jQuery 的源文件 jquery-1.3.2.js 发现以下代码 
jQuery = window.jQuery = window.$ = function( selector, context ) { 
// The jQuery object is actually just the init constructor 'enhanced' 
return new jQuery.fn.init( selector, context ); 
}

原来 $ 与 jQuery 代表的是 jQuery 框架中同一个 function,使用 jQuery 和 $ 的效果是一样的;实际上 jQuery 框架中采用 $ 来作为 jQuery 方法的一个别名(更易于使用),由于担心 $ 与其它 javascript 框架(比如 asp.net ajax)甚至个人代码中的 $ 标识符产生冲突,也可以通过 jQuery.noConflict() 函数来移除 $ 与 jQuery 函数的关联,这样 $ 就不代表 jQuery 方法了,而是代表那个原始的 $ 对象了。
2、jQuery(expression,[context])

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

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

返回值:jQuery 对象

参数

expression:

 用来查找 DOM 元素的字符串

context:

(可选) 作为待查找的 DOM 元素集、文档或 jQuery 对象,用于限定查找范围

// 查找所有 DIV 元素下的 A 元素 
$("div > a");

3、jQuery(html)

根据 HTML 字符串,动态创建由 jQuery 对象包装的 DOM 元素。

返回值:jQuery 对象

参数

html:

用于创建 DOM 元素的 HTML 字符串

// 将一个 jquery.com 的超链接元素加到页面主体元素中 
$("<a href=http://jquery.com/>jquery.com</a>").appendTo("body");

二、jQuery 对象

jQuery 核心函数的返回值都是一个 jQuery 对象,通过对 jQuery 对象进行操作,可以完成 javascript 编程中的大部分任务;那么这个 jQuery 对象到底是一个什么对象呢?
jQuery 核心函数以及jQuery对象
通过 doc[0]、doc[1] 可以分别取出一个 DOM 对象,其它的则是一些 jQuery 对象特有的属性和方法;实际上 jQuery 对象包装了 DOM 对象,同时还包含了一些操作 DOM 元素的 jQuery 方法。

在使用 jQuery 的过程中,大部分情况下第一步工作同时也是最重要的一步工作,就是取得包装了要操作 DOM 对象的 jQuery 对象;然后通过调用取得的 jQuery 对象的方法来完成对 DOM 对象的操作。

Javascript 相关文章推荐
VBS通过WMI监视注册表变动的代码
Oct 27 Javascript
JavaScript 模块化编程(笔记)
Apr 08 Javascript
jQuery幻灯片特效代码分享--鼠标滑过按钮时切换(2)
Nov 18 Javascript
JavaScript中用let语句声明作用域的用法讲解
May 20 Javascript
jQuery中的一些常见方法小结(推荐)
Jun 13 Javascript
JavaScript生成带有缩进的表格代码
Jun 15 Javascript
Ajax分页插件Pagination从前台jQuery到后端java总结
Jul 22 Javascript
JS实现淡入淡出图片效果的方法分析
Dec 20 Javascript
jQuery动态生成表格及右键菜单功能示例
Jan 13 Javascript
bootstrap模态框远程示例代码分享
May 22 Javascript
Vue.Draggable实现拖拽效果
Jul 29 Javascript
基于JavaScript 性能优化技巧心得(分享)
Dec 11 Javascript
jquery easyui的tabs使用时的问题
Mar 23 #Javascript
Jquery Ajax学习实例7 Ajax所有过程事件分析示例
Mar 23 #Javascript
jQuery 位置函数offset,innerWidth,innerHeight,outerWidth,outerHeight,scrollTop,scrollLeft
Mar 23 #Javascript
锋利的jQuery 要点归纳(二) jQuery中的DOM操作(下)
Mar 23 #Javascript
javascript 多浏览器 事件大全
Mar 23 #Javascript
jQuery $.each的用法说明
Mar 22 #Javascript
javascript 用原型继承来实现对象系统
Mar 22 #Javascript
You might like
php结合正则批量抓取网页中邮箱地址
2015/05/19 PHP
php从文件夹随机读取文件的方法
2015/06/01 PHP
JQuery 国际象棋棋盘 实现代码
2009/06/26 Javascript
javascript之typeof、instanceof操作符使用探讨
2013/05/19 Javascript
js取float型小数点后两位数的方法
2014/01/18 Javascript
jQuery+CSS3实现树叶飘落特效
2015/02/01 Javascript
javascript+HTML5自定义元素播放焦点图动画
2016/02/21 Javascript
JavaScript实现in-place思想的快速排序方法
2016/08/07 Javascript
javascript 闭包详解及简单实例应用
2016/12/31 Javascript
jquery 手势密码插件
2017/03/17 Javascript
解决vue打包之后静态资源图片失效的问题
2018/02/21 Javascript
用vue写一个仿简书的轮播图的示例代码
2018/03/13 Javascript
小程序实现发表评论功能
2018/07/06 Javascript
echarts整合多个类似option的方法实例
2018/07/10 Javascript
详解Vue CLI3配置解析之css.extract
2018/09/14 Javascript
微信小程序实现富文本图片宽度自适应的方法
2019/01/20 Javascript
JavaScript实现的拼图算法分析
2019/02/13 Javascript
vue里的data要用return返回的原因浅析
2019/05/28 Javascript
解决vue页面刷新,数据丢失的问题
2020/11/24 Vue.js
[47:21]Liquid vs TNC Supermajor 胜者组 BO3 第一场 6.4
2018/06/05 DOTA
从Python的源码浅要剖析Python的内存管理
2015/04/16 Python
Python实现字典依据value排序
2016/02/24 Python
Python抓取电影天堂电影信息的代码
2016/04/07 Python
使用TFRecord存取多个数据案例
2020/02/17 Python
Python random库使用方法及异常处理方案
2020/03/02 Python
python基本算法之实现归并排序(Merge sort)
2020/09/01 Python
澳大利亚运动鞋零售商:The Athlete’s Foot
2018/11/04 全球购物
美工的岗位职责
2013/11/14 职场文书
执行总经理岗位职责
2014/02/03 职场文书
党员大会主持词
2014/04/02 职场文书
技术合作协议书范本
2014/04/18 职场文书
党员反对四风问题思想汇报
2014/09/12 职场文书
大学毕业典礼致辞
2015/07/29 职场文书
在Windows下安装配置CPU版的PyTorch的方法
2021/04/02 Python
Spring整合Mybatis的全过程
2021/06/28 Java/Android
JavaScript最完整的深浅拷贝实现方式详解
2022/02/28 Javascript