欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页

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

程序员文章站 2022-06-07 11:32:27
...
一直以来都搞不清这几个对象到底什么关系，通过资料查阅，自己的理解如下：

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代码 
<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>



Js对象与Json对象转换
Json对象转Js对象：很容易转，自己可写方法实现。Jqeury有Jquery.parseJson(json)方法等
Js对象转Json对象：有很多第三方插件实现了，也可以自己写方法实现。下面为一个实例：
Jscript代码 
function toJson(obj){        
     switch(obj.constructor){        
         case Object:        
             var str = "{";        
             for(var o in obj){        
                 str += o + ":" + Serialize(obj[o]) +",";        
             }       www.2cto.com  
             if(str.substr(str.length-1) == ",")        
                str = str.substr(0,str.length -1);        
              return str + "}";        
              break;        
          case Array:                    
              var str = "[";        
              for(var o in obj){        
                  str += Serialize(obj[o]) +",";        
              }        
              if(str.substr(str.length-1) == ",")        
                  str = str.substr(0,str.length -1);        
              return str + "]";        
              break;        
          case Boolean:        
              return "\"" + obj.toString() + "\"";        
              break;        
          case Date:        
              return "\"" + obj.toString() + "\"";        
              break;        
          case Function:        
              break;      //如果是方法，则过滤掉，什么也不做  
         case Number:        
              return "\"" + obj.toString() + "\"";        
              break;         
          case String:       
             return "\"" + obj.toString() + "\"";        
              break;            
      }        
  }



总结：Jquery对象、Dom对象、Js对象，其实都是javascript对象，只不过有各自己的不同的属性和方法。而Json对象，严格说只是一种相应格式的数据而已。只不过同常在javascript中把json数据（字符串）转换为js对象来使用
相关标签： JavaScript

上一篇： 起售价2199元？realme真我X50 5G亮点汇总：1月7日发布

下一篇： 一张标签

推荐阅读