jquery对象和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对象,那么在变量前面加上$,例如
var $varible = jquery对象;
如果获取的是DOM对象,则定义如下:
var varible = DOM对象;
1.jquery对象转成DOM对象:
jquery对象不能使用DOM中的方法,但如果对jquery对象所提供的方法不熟悉,或者没有jquery想封装的方法,不得不使用DOM对象,即【index】和get[index].
(1)jquery对象是一个数组对象,可以通过【index】的方法得到相应的DOM对象。
jquery的代码如下
<body> <p>my</p> <p>my</p> <script src="jquery-2.1.4.min.js"></script> <script> var $cr = $("p"); //jquery对象 var cr = $cr[1]; //dom对象 var ct = $cr.get(0) //第二种转换为DOM对象的方式 cr.innerHTML = "you" //检测是否转换成功,可以用DOM方法 输出结果为第二个my改成了you ct.innerHTML = 'fuck' //输出结果第一个my改成了fuck </script> </body>
(2).DOM对象转换为jquery对象:
对于一个DOM对象,只需要用$()把DOM对象给包装起来,就可以获得一个jquery对象了,方式为$(DOM对象)。
jquery代码如下:
<body> <p>my</p> <p>my</p> <script src="jquery-2.1.4.min.js"></script> <script> var cr = document.getElementsByTagName("p") //DOM对象 var $cr = $(cr); //jquery对象 $cr.eq(0).("fuck"); //检测是否转换成功,可以用jquery方法 输出结果为第二个my改成了fuck $cr.eq(1).html("you"); //输出结果为my改成you </script> </body>
转换后,可以任意使用jquery方法。
通过以上方法,可以任意的相互转换jquery对象和DOM对象。
最后再次强调,DOM对象才能使用DOM方法,jquery对象不能使用DOM中的方法,但jquery对象提供了一套更加完善的工具用于操作DOM。
希望大家会喜欢本文。

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

Video Face Swap
使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

热门话题

我们逐步教您如何将USDTERC20转换为TRC20网络。这是因为许多人喜欢将USDT稳定币从以太坊网络转移到Tron网络,以节省交易费用。因此,如果您想将您的ERC-20代币转换为TRC-20,相信本教程会对您有所帮助。ERC-20和TRC-20的区别ERC-20代币和TRC-20代币分别代表基于以太坊网络和Tron网络的代币。这两个网络之间存在一些差异,主要表现在以下方面:首先,以太坊网络常常面临拥塞和高昂的汽油费问题,这可能导致交易延迟和高昂的交易成本。相比之下,Tron网络则相对拥塞较少

全角英文字母转换为半角形式的实用技巧在现代生活中,我们经常会接触到英文字母,在使用电脑、手机等设备时也经常需要输入英文字母。然而,有时候我们会遇到全角英文字母的情况,而我们需要使用的是半角形式。那么,如何将全角英文字母转换为半角形式呢?下面就为大家介绍一些实用的技巧。首先,全角英文字母和数字是指在输入法中占据一个全角位置的字符,而半角英文字母和数字则是占据一

AI文件指的是AdobeIllustrator(简称AI)软件创建的矢量图形文件,而CDR文件指的是CorelDRAW软件创建的矢量图形文件。由于这两个软件属于不同的厂商开发,因此它们的文件格式不同,无法直接相互转换。然而,我们可以通过一些方法将AI文件转换为CDR文件。下面将介绍一种常用的转换方法。步骤一:导出AI文件为EPS格式AdobeIllust

在这篇文章中,我们将向您展示如何将OpenDocumentTextDocument(ODT)文件转换为MicrosoftWord(Docx、DOC等)。格式。如何在Windows11/10中将ODT转换为Word以下是您可以在WindowsPC上将ODT文档转换为DOC或DOCX格式的方法:使用写字板或Word将ODT转换为Word我们要向您展示的第一种方法是使用写字板或MicrosoftWord将ODT转换为Word。以下是实现这一点的步骤:首先,使用“开始”菜单打开写字板应用程序。现在,转到

将虚拟机器(VM)转换为物理机器是一种将虚拟实例和关联的应用软件迁移到物理硬件平台的过程。这种转换有助于优化操作系统的性能和硬件资源利用。本文旨在深入探讨如何进行这种转换。如何实现从虚拟机到物理机的迁移?通常,虚拟机与物理机之间的转换过程由第三方软件在虚拟机外部执行。这个过程包括多个阶段,涉及虚拟机的配置和资源转移。准备物理机器:第一步是确保物理机满足Windows的硬件要求。我们需要在物理机上备份数据,因为转换过程将覆盖现有数据。*管理员帐户的用户名和密码,具有创建系统映像的管理员权限。将虚拟

Golang时间转换:如何将时间戳转换为字符串在Golang中,时间操作是非常常见的操作之一。有时候我们需要将时间戳转换为字符串,以便于展示或者存储。本文将介绍如何使用Golang将时间戳转换为字符串,并提供具体的代码示例。1.时间戳和字符串的转换在Golang中,时间戳通常是以整型数字的形式表示的,表示的是从1970年1月1日至当前时间的秒数。而字符串则

这篇文章将详细介绍如何将PHP中的月份转换为英文月份的方法,同时给出具体的代码示例。在PHP开发中,有时候我们需要将数字表示的月份转换为英文的月份,这在一些日期处理或数据展示的场景下非常实用。下面将从实现原理、具体代码示例和注意事项等方面进行详解。一、实现原理在PHP中,可以通过使用DateTime类和format方法来实现将数字月份转换为英文月份。Date

qq音乐让大家尽情享受观影解闷,每天都可以使用这个软件,轻松满足自己的使用,优质海量的歌曲,任由大家畅听,也可以下载保存起来,下次听的时候,不需要网络,而在这里下载的歌曲不是MP3格式的,无法在其他平台使用,会员歌曲过期后也没有办法再听了,所以很多小伙伴们,都想要将歌曲转换成MP3格式的,在这里小编为你们提供方法,帮助大家都可以使用起来! 1、打开电脑qq音乐,点击右上角【主菜单】按钮,点击【音频转码】,选择【添加歌曲】选项,添加需要转换的歌曲; 2、添加歌曲完毕,点击选择转换为【mp3
