刚开始学习jQuery,可能一时会分不清楚哪些是jQuery对象,哪些是DOM对象。至于DOM对象不多解释,我们接触的太多了,下面重点介绍一下jQuery,以及两者相互间的转换。
什么是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有区别但也有联系,那么jQuery对象与DOM对象也可以相互转换。在再两者转换前首先我们给一个约定:如果一个获取的是jQuery对象,那么我们在变量前面加上$,如:var $variab = jQuery对象;如果获取的是DOM对象,则与习惯普通一样:var variab = DOM对象;这么约定只是便于讲解与区别,实际使用中并不规定。
jQuery对象转成DOM对象:
两种转换方式将一个jQuery对象转换成DOM对象:[index]和.get(index);
(1)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对象了。$(DOM对象)
如:var v=document.getElementById("v"); //DOM对象
var $v=$(v); //jQuery对象
转换后,就可以任意使用jQuery的方法了。
通过以上方法,可以任意的相互转换jQuery对象和DOM对象。需要再强调注意的是:DOM对象才能使用DOM中的方法,jQuery对象是不可以用DOM中的方法。
本文来自CSDN博客,转载请标明出处:http://blog.csdn.net/lansky07/archive/2008/11/26/3379024.aspx
分享到:
相关推荐
例如,要创建一个对话框,可以使用`$("#element").dialog()`方法,其中"#element"是需要转换成对话框的DOM元素。 总的来说,"jquery-ui-1.8.2.custom.min.js"是jQuery UI的一个压缩版实现,包含了丰富的UI组件和...
jQuery 是一个广泛使用的JavaScript库,它简化了DOM操作、AJAX请求、事件处理以及创建复杂的网页特效。jQuery的核心特性包括对JSON...同时,理解jQuery对象和DOM对象的区别及其相互转换,是有效利用jQuery功能的关键。
在实际开发中,我们首先需要将 "jquery-1.7.1.min.js" 引入页面,它是 jQuery 的核心库,提供了基础的DOM操作、事件处理和Ajax等功能。然后引入 "jquery-ui-1.8.18.custom.min.js" 和相应的CSS文件,以启用jQuery UI...
**jQuery对象和DOM对象之间的转换** 虽然jQuery对象和DOM对象各有优势,但在实际开发中,我们经常需要在两者之间进行转换。jQuery提供了`.get()`, `.get(0)`, `[index]`等方式将jQuery对象转换为DOM对象,而通过`$...
jQuery的核心在于它的选择器功能,它极大地简化了DOM(文档对象模型)的操作。例如,通过"$()"函数,我们可以轻松地选取页面上的元素,然后执行各种操作,如添加类、改变HTML内容或者处理事件。在1.9.1版本中,...
因此,我们需要将jQuery-File-Upload的行为转换为AngularJS的服务或指令。 首先,我们需要创建一个自定义的AngularJS指令,该指令负责初始化和管理jQuery-File-Upload实例。这可以通过使用`link`函数来实现,其中...
在Web开发中,经常需要在jQuery对象和DOM对象之间进行转换,以便可以利用各自对象的方法优势进行高效编程。jQuery对象是包装了DOM对象的类数组对象,它们之间的转换虽然看似简单,但在实际操作中却非常重要。 首先...
对于包含图片的表格,`jquery-table2excel`会将图片转换为Base64编码,并嵌入到生成的Excel文件中,这样在打开Excel时仍能显示图片。 然而,需要注意的是,由于Excel文件格式的限制,不是所有的HTML特性都能完美地...
当我们谈论jQuery对象和DOM对象时,我们需要理解两者之间的基本差异和转换方法。 DOM(Document Object Model)是HTML和XML文档的结构表示,允许我们通过JavaScript来访问和修改网页内容。DOM对象是通过JavaScript...
JavaScript中的DOM对象和jQuery对象是两种不同的数据结构,它们在处理网页元素时有着各自的特性和优缺点。了解它们之间的联系和区别对于JavaScript开发者来说至关重要,因为这有助于选择合适的工具进行网页交互。 ...
1. **jQuery.js**: 这是jQuery的核心库,为jQuery-QueryBuilder提供基础的DOM操作、事件处理和动画效果。jQuery简化了JavaScript的跨浏览器编程,使开发者能更高效地操作HTML元素。 2. **jQuery-queryBuilder.js**:...
然后,我们讨论DOM对象与jQuery对象的区别和转换。DOM(Document Object Model)是HTML和XML文档的标准表示,而jQuery对象则是jQuery库处理的特定对象,封装了DOM元素。DOM对象是原生JavaScript操作,如通过`...
jQuery是一个轻量级的JavaScript库,简化了DOM操作、事件处理、动画效果和Ajax交互。而jQuery UI则是在jQuery基础上构建的一套完整的用户界面解决方案,它包含了多种可复用的UI组件,其中就包括了层级菜单。 在我们...
2. **从DOM到jQuery**:如果有一个DOM对象,想要转换成jQuery对象以便使用jQuery提供的方法,则可以使用`$(dom)`。例如,`var $cr = $(cr);`将DOM对象`cr`转换成了jQuery对象。 #### 总结 DOM与jQuery之间的关系是...
- JSON.parse()和JSON.stringify():这两个是JavaScript内置的JSON处理方法,分别用于解析JSON字符串为JavaScript对象,和将JavaScript对象转换为JSON字符串。 - jQuery.extend():jQuery的扩展方法可以用来合并...
了解如何在jQuery对象和DOM对象之间转换至关重要,这可以帮助我们在需要使用jQuery的强大功能时,也能灵活地利用DOM对象的原生方法。例如,当你需要操作某个特定的DOM属性,而jQuery没有提供直接的接口时,可以先将...
jQuery是一个广泛使用的JavaScript库,它简化了DOM操作、事件处理、动画和Ajax交互,使得开发者能更高效地构建动态网页。 在描述中提到的问题是9月份显示为“90”,而不是常规的“09”。这很可能是一个字符串格式化...
首先,我们需要了解jQuery,这是一个广泛使用的JavaScript库,简化了DOM操作、事件处理、动画以及Ajax交互,使得前端开发更加便捷。jQuery的核心理念是"Write Less, Do More",它通过提供简洁的API,降低了...
这里,`$(function() {...})`是jQuery的文档就绪事件,确保在DOM加载完成后执行代码。`$("#progressbar").progressbar()`则是将指定的元素转换为进度条组件,`{value: 25}`则是设置初始进度。 如果需要动态更新进度...
在前端开发领域,jQuery是一个广泛使用的JavaScript库,它极大地简化了JavaScript操作DOM、处理事件、创建动画以及实现AJAX交互。本项目“前端项目-jquery-json.zip”专注于jQuery与JSON的交互,提供了一套插件来...