深入浅析jQuery对象$.html


Posted in Javascript onAugust 22, 2016

$对象

说起jQuery,最明显的标志,毫无疑问,就是, ,其实是jquery的简写。而使用$()包装的对象就是jQuery对象

与jQuery对象相对应的就是DOM对象,DOM对象其实就是DOM元素节点对象

如果直接写document,则指的是document的DOM元素对象

document.onclick = function(){
alert('dom');
}

而如果用()包括起来,如 ()包括起来,如(document),是jQuery(document)的简写形式,则指的是jQuery对象

<script src="jquery-3.1.0.js"></script> 
<script>
console.log(jQuery(document));//[document]
console.log($(document));//[document]
console.log(document);//#document
</script>

[注意]jQuery对象无法使用DOM对象的方法,DOM对象也无法使用jQuery对象的方法

<script src="jquery-3.1.0.js"></script> 
<script>
//无反应
$(document).onclick = function(){
alert(0);
};
//Uncaught TypeError: document.click is not a function
document.click(function(){
alert(1);
});
</script>

转换

【1】DOM转jQuery对象

对于一个jQuery对象,只需要用$()把DOM对象包装起来,就可以获得一个jQuery对象

【2】jQuery转DOM对象

jQuery是一个类数组对象,可以通过[index]或get(index)的方法得到相应的DOM对象

console.log(document === $(document)[0]);//true
console.log(document === $(document).get(0));//true

 共存

如果jQuery对象和DOM对象指向同一对象,绑定不同函数,则函数会按照顺序依次执行

//先弹出0,再弹出1
document.onclick = function(){
alert(0);
}
$(document).click(function(){
alert(1);
});

以上所述是小编给大家介绍的jQuery对象$.html,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
农历与西历对照
Sep 06 Javascript
arguments对象
Nov 20 Javascript
Javascript 类与静态类的实现(续)
Apr 02 Javascript
关于Javascript加载执行优化的研究报告
Dec 16 Javascript
JavaScript基本语法讲解
Jun 03 Javascript
javascript比较两个日期相差天数的方法
Jul 23 Javascript
微信小程序实现下载进度条的方法
Dec 08 Javascript
JavaScript时间戳与时间日期间相互转换
Dec 11 Javascript
BootStrap自定义popover,点击区域隐藏功能的实现
Jan 23 Javascript
JavaScript继承与多继承实例分析
May 26 Javascript
微信小程序在ios下Echarts图表不能滑动的问题解决
Jul 10 Javascript
Vue 电商后台管理项目阶段性总结(推荐)
Aug 22 Javascript
基于JavaScript实现添加到购物车效果附源码下载
Aug 22 #Javascript
利用原生JS自动生成文章标题树的实例
Aug 22 #Javascript
jQuery使用deferreds串行多个ajax请求
Aug 22 #Javascript
JavaScript代码里的判断小结
Aug 22 #Javascript
angularjs 源码解析之scope
Aug 22 #Javascript
js表单元素checked、radio被选中的几种方法(详解)
Aug 22 #Javascript
js严格模式总结(分享)
Aug 22 #Javascript
You might like
PHP Squid中可缓存的动态网页设计
2008/09/17 PHP
php对包含html标签的字符串进行截取的函数分享
2014/06/19 PHP
jQuery chili图片远处放大插件
2009/11/30 Javascript
JQERY limittext 插件0.2版(长内容限制显示)
2010/08/27 Javascript
Jquery 获取checkbox的checked问题
2011/11/16 Javascript
JS实现模拟风力的雪花飘落效果
2015/05/13 Javascript
JavaScript基于ajax编辑信息用法实例
2015/07/15 Javascript
js实现基于正则表达式的轻量提示插件
2015/08/29 Javascript
深入理解ECMAScript的几个关键语句
2016/06/01 Javascript
Javascript实现图片加载从模糊到清晰显示的方法
2016/06/21 Javascript
jquery自定义表单验证插件
2016/10/12 Javascript
浅谈js数组和splice的用法
2016/12/04 Javascript
详解AngularJS ui-sref的简单使用
2017/04/24 Javascript
微信小程序 共用变量值的实现
2017/07/12 Javascript
基于jQuery的表单填充实例
2017/08/22 jQuery
使用SVG基本操作API的实例讲解
2017/09/14 Javascript
Vue.js组件通信的几种姿势
2017/10/23 Javascript
详解使用 Node.js 开发简单的脚手架工具
2018/06/08 Javascript
Laravel admin实现消息提醒、播放音频功能
2019/07/10 Javascript
Node.js 实现简单的无侵入式缓存框架的方法
2019/07/21 Javascript
微信小程序基于movable-view实现滑动删除效果
2020/01/08 Javascript
Vue实现可移动水平时间轴
2020/06/29 Javascript
Python实现爬取逐浪小说的方法
2015/07/07 Python
python xml解析实例详解
2016/11/14 Python
python+selenium+autoit实现文件上传功能
2017/08/23 Python
利用numpy和pandas处理csv文件中的时间方法
2018/04/19 Python
python 重定向获取真实url的方法
2018/05/11 Python
Python 日志logging模块用法简单示例
2019/10/18 Python
RUIFIER官网:英国奢侈高级珠宝品牌
2020/06/12 全球购物
淘宝中秋节活动方案
2014/01/31 职场文书
2014年图书馆工作总结
2014/11/25 职场文书
2014年保卫科工作总结
2014/12/05 职场文书
工程项目经理岗位职责
2015/02/02 职场文书
浅谈:电影《孔子》观后感(范文)
2019/10/14 职场文书
收音机爱好者玩机13年,简评其使用过的19台收音机
2022/04/30 无线电
HTML5页面打开微信小程序功能实现
2022/09/23 HTML / CSS