jquery对象和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。

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！

jquery对象和DOM对象的相互转换详解的更多相关文章

  1. 【Jquery系列】详解Jquery对象和Dom对象

    问题描述 本篇文章主要讲解Jquery对象和DOM对象,主要围绕如下五个方面来介绍: Jquery对象和dom对象定义 Jquery对象与dom对象区别 Jquery对象及运用举例 dom对象及运用举 ...

  2. jquery对象和dom对象的相互转换

    更好的学习jquery,要区分好jquery对象和dom对象的区别. 先具体说说dom.举个例子 <html> <head></head> <body> ...

  3. jQuery对象和DOM对象之间的相互转换

    DOM对象:DOM(Document Object Model,文档对象模型),每一份DOM都可以表示成为一棵树,DOM对象可以使用javascript中的方法. jQuery对象:jQuery对象就 ...

  4. Jquery 对象与 DOM对象的相互转换

    在做 web 开发时,经常会用到 jquery 和 dom 对象, 有时候需要在这两个对象间进行切换. Jquery 对象 就是通过jQuery包装DOM对象后产生的对象.jQuery对象是jQuer ...

  5. jQuery对象与Dom对象的相互转换

    1.jQuery对象转换为Dom对象 [index] var $d = $("#id"); ]; get(index) var $d = $("#id"); ) ...

  6. JQuery $ $.extend(),$.fn和$.fn.extend javaScript对象、DOM对象和jQuery对象及转换 工具方法(utility)

    一.为什么jquery前面要写$ Javascript没有package的概念,而作者又希望所有jQuery相关的API都能通过一个全局性的对象来容纳. 名为jQuery的全局变量就是这样一个对象,不 ...

  7. jQuery对象和DOM对象的区别

    jQuery对象和DOM对象使用说明,需要的朋友可以参考下.1.jQuery对象和DOM对象第一次学习jQuery,经常分辨不清哪些是jQuery对象,哪些是 DOM对象,因此需要重点了解jQuery ...

  8. jQuery对象与dom对象相互转换

    核心提示:jquery选择器得到的jquery对象和标准的 javascript中的document.getElementById()取得的dom对象是两种不同的对象类型,一般情况下,如S('#id' ...

  9. jQuery对象与DOM对象之间的转换方法

    刚开始学习jquery,可能一时会分不清楚哪些是jQuery对象,哪些是DOM对象.至于DOM对象不多解释,我们接触的太多了,下面重点介绍一下jQuery,以及两者相互间的转换. 什么是jQuery对 ...

随机推荐

  1. python爬虫学习之查询IP地址对应的归属地

    话不多说,直接上代码吧. import requests def getIpAddr(url): response = requests.get(url) response.encoding=resp ...

  2. 细说MySQL表操作

    目录 语法 查看表结构 查看所有的表 删除表 查看创建表的语句 修改表的字符集和校验规则 修改表名 在表中添加新字段 修改表的字段名 修改表中字段的属性 删除表中的某个字段 设置某个字段为主键 把某个 ...

  3. C++ Opencv 自写函数实现膨胀腐蚀处理

    一.膨胀腐蚀学习笔记 二.代码及结果分享 #include <opencv2/opencv.hpp> #include <iostream> using namespace s ...

  4. Java面试集合（六）

    1. abstract抽象 什么是abstract,中文为抽象,从具体事物抽出,概括它们共同的方面,本质属性与关系等,称为抽象.看不见,摸不着的东西叫做抽象,抽象是人们对世界万物的感觉,用特定的图像表 ...

  5. JavaScript 数组方法

    数组方法: 1.Array.join([param]) 方法:将数组中所有的元素都转换为字符串并连接起来,通过字符 param 连接,默认使用逗号,返回最后生成的字符串 2.Array.reverse ...

  6. 【vim】模式与模式切换

    很多初学者启动vim后,不知道怎么输入字符:按了半天字母,结果屏幕还是空的. vim和记事本或WORD不一样,不是一打开后就可以输入文字,此时它处于正常模式. vim一共有4个模式: 正常模式 (No ...

  7. java后端服务器读取excel将数据导入数据库

    使用的是easypoi,官网文档:http://easypoi.mydoc.io/ /** * 导入Excel文件 */ @PostMapping("/importTeacher" ...

  8. Python制作二维码和条形码扫描器 （pyzbar）

    条码在生活中随处可见,其可分为三类:一维条码.二维条码.三维条码 一维条码: 我们平时习惯称为条形码.条形码是将宽度不等的多个黑条和空白,按照一定的编码规则排列,用以表达一组信息的图形标识符.常见的条 ...

  9. JavaScript变量转换

    JavaScript变量转换 目录 自动转换 (1)Number与Boolean (2)Number与String (3)String与Boolean (4)null的自动转换 (5)undefine ...

  10. [工具]K8tools github/K8工具合集/K8网盘

    K8tools 20190428 声明: 工具仅供安全研究或授权渗透,非法用途后果自负. 博客: https://www.cnblogs.com/k8gege 下载: https://github.c ...