jQuery对象与dom对象的区别与相互转换
什么是jQuery对象?
就是通过jQuery包装DOM对象后产生的对象。jQuery对象是jQuery独有的,其可以使用jQuery里的方法。
例如:
$("#test").html()
意思是指:获取ID为test的元素内的html代码。其中html()是jQuery里的方法
这段代码等同于用DOM实现代码:
document.getElementById("id").innerHTML;
虽然jQuery对象是包装DOM对象后产生的,但是jQuery无法使用DOM对象的任何方法,同理DOM对象也不能使用jQuery里的方法.乱使用会报错。比如:$("#test").innerHTML、document.getElementById("id").html()之类的写法都是错误的。
注意:用#id作为选择符取得的是jQuery对象与document.getElementById("id")得到的DOM对象,这两者并不等价。请参看如下说的两者间的转换。
jQuery对象转成DOM对象
两种转换方式将一个jQuery对象转换成DOM对象:[index]和.get(index);
(一)jQuery对象是一个数据对象,可以通过[index]的方法,来得到相应的DOM对象。
例:
var $v =$("#v") ; //jQuery对象
var v=$v[0]; //DOM对象
alert(v.checked) //检测这个checkbox是否被选中
(2)jQuery本身提供,通过.get(index)方法,得到相应的DOM对象。
例:
var $v=$("#v"); //jQuery对象
var v=$v.get(0); //DOM对象
alert(v.checked) //检测这个checkbox是否被选中
DOM对象转成jQuery对象
对于已经是一个DOM对象,只需要用$()把DOM对象包装起来,就可以获得一个jQuery对象了。
例:
var v=document.getElementById("v"); //DOM对象
var $v=$(v); //jQuery对象
转换后,就可以任意使用jQuery的方法了。
总结
例如:
$("#msg")[0],$("div").eq(1)[0],$("div").get()[1],$("td")[5]
这些都是dom对象,可以使用dom中的方法,但不能再使用Jquery的方法。
以下几种写法都是正确的:
$("#msg").html();
$("#msg")[0].innerHTML;
$("#msg").eq(0)[0].innerHTML;
$("#msg").get(0).innerHTML;
jQuery对象与dom对象的区别与相互转换的更多相关文章
- jQuery对象和DOM对象的区别
jQuery对象和DOM对象使用说明,需要的朋友可以参考下.1.jQuery对象和DOM对象第一次学习jQuery,经常分辨不清哪些是jQuery对象,哪些是 DOM对象,因此需要重点了解jQuery ...
- JQuery对象与DOM对象的区别与转换
1.jQuery对象和DOM对象的区别 DOM对象,即是我们用传统的方法(javascript)获得的对象,jQuery对象即是用jQuery类库的选择器获得的对象; eg: var domObj ...
- jQuery学习-----(二)JQuery对象与DOM对象的区别与转换
1.jQuery对象和DOM对象的区别 DOM对象,即是我们用传统的方法(javascript)获得的对象,jQuery对象即是用jQuery类库的选择器获得的对象; eg: var domObj = ...
- 关于jquery对象和DOM对象的区别
这个问题的出现是因为自己对jquery不够了解,只会获取简单的Demo,做简单的操作,将jquery的很多方法和js中的混淆,以为js中的很多方法,在jquery中也可以使用,这是完全错误的理解! 所 ...
- jquery对象和DOM对象的区别和转换
jquery对象和DOM对象的区别和转换 在使用jquery时,我们直接通过jq的选择器获取元素,然后对元素进行操作,用jq选择器获取到的对象是一个jq对象,jq对象能够使用jq提供的方法,但是不能用 ...
- 2、jQuery的基本概念-必看-版本-入口函数- jq对象和dom对象区别
1.4. jQuery的版本 官网下载地址:http://jquery.com/download/ jQuery版本有很多,分为1.x 2.x 3.x 大版本分类: 1.x版本:能够兼容IE678浏览 ...
- JS对象与Dom对象与jQuery对象之间的区别
前言 通过问题看本质: 举例: js的写法:document.getElementById('save').disabled=true; 在jquery中我是这样写的 $("#save&qu ...
- 【二】jquery之基础概念与jquery对象与dom对象的区别及混合使用
一:jquery基本概念 1.jquery是一个javascript框架,它是一个轻量级的js库 2.当下流行的js库有: jquery MooTools Prototype 3.$(ducoment ...
- 了解jQuery并掌握jQuery对象和DOM对象的区别
jQuery的优势: 开源--开放源代码 轻量级 强大的选择器 出色的DOM操作(对DOM元素的一个增删改查) 完善的Ajax,出色的浏览器兼容性,丰富的插件支持,完善的文档(说明书) 链式操作方式, ...
- jQuery对象与DOM对象的区别
如何判断一个js对象是否一个DOM对象 我们在写js代码时有时需要判断某个对象是不是DOM对象,然后再进行后续的操作,这里我给出一种兼容各大浏览器,同时又算是比较稳妥的一种方法. 要判断一个对象是否D ...
随机推荐
- 平衡二叉树---Shaolin
Description Shaolin temple is very famous for its Kongfu monks.A lot of young men go to Shaolin temp ...
- redis3.0 集群实战3 - java编程实战
本文主要描述使用jedis进行redis-cluster操作 jedis jedis是redis官方推荐使用的java redis客户端,github地址为,https://github.com/ ...
- 【GOF23设计模式】模板方法模式
来源:http://www.bjsxt.com/ 一.[GOF23设计模式]_模板方法模式.钩子函数.方法回调.好莱坞原则 package com.test.templateMethod; publi ...
- CSS的一些小事
1.什么时候能将零散的图片整合成一张大图,达到减少请求数的作用? 答:整合进大图的图片是被设置no-repeat用的,如果是repeat-x.repeat-y就不可以. 2.E + F 选择紧贴在E元 ...
- ES6--class基本使用
类定义 ES6完整学习阮老师的ECMAScript6入门. 技术一般水平有限,有什么错的地方,望大家指正. 以前我们使用ES5标准定义一个构造函数的过程如下: function Person(name ...
- 利用jQuery的淡入淡出实现轮播器
基本原理:将所有图片绝对定位在同一位置,透明度设为0,然后通过jQuery的淡入淡出实现图片的切换效果: 但我在使用fadeIn淡入时却无效果,最后只能使用fadeTo实现,求大神指教 HTML: & ...
- SharePoint 2013 对象模型操作"网站设置"菜单
在SharePoint的开发中,经常会有客户提到网站操作上的栏目过多,其实,我们除了可以通过Feature的方式添加,还可以通过服务器端对象模型的方式添加:下面,让我用简单的例子,给大家介绍一下: 1 ...
- MVC.Net: 解决Attempted to access an unloaded appdomain的问题
在C#中尝试获取AD帐号信息时,会随机出现Attempted to access an unloaded appdomain的问题,解决方法如下: 将 principalContext = new P ...
- 【读书笔记】iOS-NSData
Cocoa为我们提供了NSData类,该类包装了大量字节,你可以获得数据的长度和指向字节起始位置的指针,因为NSData是一个对象,适用于常规的内存管理行为.因此,如果将数据块传递给一个函数或方法,可 ...
- Cent OS 6.4安装mysql
Cent OS6.4 RPM安装mysql 一.卸载掉原有mysql 因为目前主流Linux系统版本基本上都集成了mysql数据库在里面 如下命令来查看我们的操作系统上是否已经安装了mysql数据库 ...