日期:2014-05-16  浏览次数:20418 次

JS对象、DOM对象、Jqeury对象、Json对象 对比分析
一直以来都搞不清这几个对象到底什么关系,通过资料查阅,自己的理解如下:

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对象来使用