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 相关文章推荐
JavaScript 申明函数的三种方法 每个函数就是一个对象(一)
Dec 04 Javascript
解决3.01版的jquery.form.js中文乱码问题的解决方法
Mar 08 Javascript
jquery ajax请求实例深入解析
Nov 26 Javascript
js window.open弹出新的网页窗口
Jan 16 Javascript
基于jQuery实现文本框缩放以及上下移动功能
Nov 24 Javascript
javascript中CheckBox全选终极方案
May 20 Javascript
jQuery实现网站添加高亮突出显示效果的方法
Jun 26 Javascript
jQuery fadeOut 异步实例代码详解
Aug 18 Javascript
Vue.js学习之计算属性
Jan 22 Javascript
Node.JS段点续传:Nginx配置文件分段下载功能的实现方法
Mar 12 Javascript
vue 属性拦截实现双向绑定的实例代码
Oct 24 Javascript
JS实现基本的网页计算器功能示例
Jan 16 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之PHP语法学习笔记1
2006/12/17 PHP
收集的DedeCMS一些使用经验
2007/03/17 PHP
PHP的分页功能
2007/03/21 PHP
php中substr()函数参数说明及用法实例
2014/11/15 PHP
PHP实现的json类实例
2015/07/28 PHP
SESSION存放在数据库用法实例
2015/08/08 PHP
针对thinkPHP5框架存储过程bug重写的存储过程扩展类完整实例
2018/06/16 PHP
javascript基础第一章 JavaScript与用户端
2010/07/22 Javascript
在子窗口中关闭父窗口的一句代码
2013/10/21 Javascript
原生js结合html5制作小飞龙的简易跳球
2015/03/30 Javascript
JavaScript实现列表分页功能特效
2015/05/15 Javascript
创建基于Bootstrap的下拉菜单的DropDownList的JQuery插件
2016/06/02 Javascript
BootStrap初学者对弹出框和进度条的使用感觉
2016/06/27 Javascript
关于AngularJs数据的本地存储详解
2017/01/20 Javascript
jQuery实现动态生成表格并为行绑定单击变色动作的方法
2017/04/17 jQuery
用Nodejs搭建服务器访问html、css、JS等静态资源文件
2017/04/28 NodeJs
详解angular 中的自定义指令之详解API
2017/06/20 Javascript
关于vue.js发布后路径引用的问题解决
2017/08/15 Javascript
React优化子组件render的使用
2019/05/12 Javascript
微信小程序系列之自定义顶部导航功能
2019/05/21 Javascript
python使用beautifulsoup从爱奇艺网抓取视频播放
2014/01/23 Python
将Python代码打包为jar软件的简单方法
2015/08/04 Python
浅谈Pandas中map, applymap and apply的区别
2018/04/10 Python
Python多线程编程之多线程加锁操作示例
2018/09/06 Python
python自定义函数def的应用详解
2020/06/03 Python
英国羊皮鞋类领先品牌:Just Sheepskin
2019/12/12 全球购物
eharmony澳大利亚:网上约会服务
2020/02/29 全球购物
综治宣传月活动总结
2014/04/28 职场文书
军训拉歌口号
2014/06/13 职场文书
政风行风自查自纠报告
2014/10/21 职场文书
财产分割协议书范本
2014/11/03 职场文书
先进工作者事迹材料
2014/12/23 职场文书
卫生主题班会
2015/08/14 职场文书
干货干货!2019最新优秀创业计划书
2019/03/21 职场文书
2019餐饮行业创业计划书!
2019/06/27 职场文书
基于Python和openCV实现图像的全景拼接详细步骤
2021/10/05 Python