JS对象、DOM对象、Jqeury对象、Json对象对比分析

最新推荐文章于 2024-06-21 09:44:49 发布

洪文聊架构

最新推荐文章于 2024-06-21 09:44:49 发布

阅读量2.7k

点赞数

分类专栏：【JavaScript/Jquery】

本文链接：https://blog.csdn.net/shb_derek1/article/details/37881797

版权

【JavaScript/Jquery】专栏收录该内容

30 篇文章 1 订阅

订阅专栏

一直以来都搞不清这几个对象到底什么关系，通过资料查阅，自己的理解如下：

JS对象：javascript对象，在js代码里面定义的对象（对象有属性和方法）。

DOM对象：其实就是定义好了的JS对象，只不过针对规范的DOM标准定义好了对象的相关属性和方法。如Document对象有body、cookie等属性和close()、writer()等方法。

Jquery对象：用Jquery语法包装原始Dom对象后生成的新对象。（包装后的Jquery对象就可以使用Jquery方法了）。

Json对象：理论上只是一种数据格式，它只是一种相应格式的字符串数据。它的出现主要是用于在不同的语言之间进行数据交互。严格说，这种对象只有属性和相应的值，并没有方法。

Dom对象与Jquery对象的互转
Dom对象转Jquery对象：只需通过Jquery方法$( )进行包装就可以转换成Jquery对象。
Jquery对象转Dom对象：只要调用JQuery中提供的 [index] 与 get(index)方法即可将Jqeury对象转成Dom对象。

事例：

Jscript代码

    Java代码   
    
  
 <head>    
     <title>DOM对象与jQuery对象的类型转换</title>    
     <script type="text/javascript"     
             src="Jscript/jquery-1.4.2-vsdoc.js">    
     </script>    
     <script type="text/javascript"     
             src="Jscript/jquery-1.4.2.js">    
     </script>    
     <style type="text/css">    
            body{font-size:13px}    
            div{padding:5px}    
     </style>    
     <script type="text/javascript">    
         $(function() {    
             //***** DOM对象转成jQuery对象 *****//    
             //DOM对象    
             var objDom0 = document.getElementById("div0");    
             //转成jQuery对象    
             var $obj0 = $(objDom0);    
             //调用jQuery中的方法设置其中的内容    
             $obj0.html("DOM对象转成jQuery对象后设置的内容");    
     
             //***** jQuery对象转成DOM对象 *****//    
             //jQuery对象    
             var $obj1 = $("#div1");    
             //转成DOM对象    
             var objDom1 = $obj1.get(0);    
             //调用JavaScript中的对象方法设置内容    
             objDom1.innerHTML = "jQuery对象转成DOM对象后设置的内容";    
         })    
     </script>    
 </head>    
 <body>    
     <div id="div0"></div>    
     <div id="div1"></div>    
 </body>    
 </html>   