`
wuzhihui001
  • 浏览: 19998 次
  • 性别: Icon_minigender_1
  • 来自: 湖南
社区版块
存档分类
最新评论

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对象来使用
分享到:
评论

相关推荐

    使用JQuery实现从JSON对象转换为form提交数据

    jQuery是一个强大的JavaScript库,提供了丰富的API来简化DOM操作、事件处理、动画效果以及Ajax交互。在处理表单数据时,jQuery的`serialize()`和`serializeArray()`方法尤为有用。 1. **JSON对象到表单数据的转换**...

    Jquery.json.js

    jQuery提供了方便的方法来处理JSON数据,包括`$.getJSON()`和`$.ajax()`等函数,可以方便地从服务器获取JSON数据并将其转化为JavaScript对象,或者将JavaScript对象转换为JSON字符串发送到服务器。 **jQuery的get...

    jquery.json2xml.js和jquery.xml2json.js

    `jquery.json2xml.js` 脚本允许开发者将JSON对象转换为XML字符串。在JavaScript中,你可以通过创建一个JSON对象,然后调用这个插件的方法,将其转换成XML格式。这样可以方便地将JSON数据发送到服务器,或者在需要XML...

    jquery_json.rar_JSON_jquery_jquery-json_jquery.json_jquery.json.

    收到JSON响应后,使用`$.parseJSON`将JSON字符串解析成JavaScript对象,然后可以方便地操作这些数据来更新DOM元素。反之,如果需要将用户在网页上的操作结果(如表单数据)发送回服务器,可以先使用`$.toJSON`将数据...

    Jquery xml2Json

    在实际应用中,比如从服务器获取的响应数据是XML格式,使用这个插件可以方便地将数据转化为JSON,然后利用jQuery的DOM操作方法进行数据绑定、动态渲染视图等操作。这极大地提高了开发效率,减少了数据处理的复杂性。...

    jQuery对后台json的解析

    在JavaScript的世界里,jQuery是一个非常流行的库,它简化了DOM操作、事件处理和Ajax交互等任务。当涉及到与后台交互时,JSON(JavaScript Object Notation)作为一种轻量级的数据交换格式,经常被用来传递数据。这...

    jQuery读取json数据

    3. **自动JSON解析**:jQuery会自动将服务器响应的JSON字符串转换为JavaScript对象,避免了手动解析的繁琐步骤。 4. **良好的错误处理**:jQuery提供了一套完整的错误处理机制,可以优雅地处理网络或服务器问题。 ...

    jquery1.7+jquery for json 2.3

    2. **`jQuery.parseJSON()`**:与`jQuery.toJSON()`相反,此方法将JSON格式的字符串解析成JavaScript对象,方便在客户端操作。如: ```javascript var jsonString = '{"name": "John", "age": 30}'; var obj = ...

    jquery.json-viewer, 用于显示JSON数据的jQuery插件.zip

    jquery.json-viewer, 用于显示JSON数据的jQuery插件 jQuery浏览器JSON浏览器是一个jQuery插件,它可以通过将JSON对象转化为HTML来轻松显示JSON对象。功能:语法高亮显示在单击时折叠和展开子节点可以点击链接易于...

    jQuery ajax读取json文件内容

    通过以上分析,我们不仅理解了如何使用jQuery的Ajax功能读取JSON文件,还深入了解了JSON文件的结构以及如何在JavaScript中解析和展示这些数据。这种方法对于构建动态网站、实现用户界面的实时更新具有重要意义。掌握...

    28_JQuery的JSON支持

    同时,jQuery还支持将JavaScript对象转换为JSON字符串,使用`$.param()`或`JSON.stringify()`函数。例如,将一个JavaScript对象序列化成JSON字符串: ```javascript var obj = {key1: 'value1', key2: 'value2'}; ...

    jquery dom对象 详细介绍1

    jQuery 是一个广泛使用的JavaScript库,它简化了DOM操作、AJAX请求、事件处理以及创建复杂的网页特效。jQuery的核心特性包括对JSON的支持、XML解析以及一套强大的选择器系统,使得开发者能够更加高效地选取和操作...

    jquery.json.min.2.3.0.js;json2.js

    jQuery库提供基础的DOM操作和事件处理,jQuery UI扩展了丰富的用户界面组件,而json2.js和jquery.json.min.2.3.0.js则处理JSON数据的序列化和反序列化,为与服务器交换数据提供便利。这些工具在开发高效、响应式的...

    jquery.jsoncookie.zip

    使用`jquery.jsoncookie.js`插件,你可以方便地将JSON对象序列化成字符串并存入Cookie,或者从Cookie中读取JSON数据并反序列化回对象。以下是一些基本用法: 1. 存储JSON数据到Cookie: ```javascript $.cookie('...

    JS,JQuery 对JSON对象的操作

    通过上述方法,你可以轻松地在JS和jQuery中处理JSON数据,实现对JSON对象的增删改查。结合HTML,这些操作能有效地更新网页内容,为用户提供动态的交互体验。在实际项目中,确保正确处理JSON数据,防止潜在的错误和...

    对象转换为JSON数据格式&使用JQuery获取数据

    描述中提到了“使用JQuery获取数据”,jQuery是一个强大的JavaScript库,它简化了DOM操作、事件处理、动画和Ajax交互等任务。在获取数据方面,jQuery提供了`$.ajax()`,`$.getJSON()`,`$.get()`和`$.post()`等方法...

    jquery.json-viewer示例

    jQuery JSON Viewer 是一个非常实用的JavaScript插件,用于将JSON对象以易于阅读和理解的格式展示出来。它通过提供一个清晰的树状结构,使得复杂的JSON数据变得直观,这对于开发者在调试、查看或者演示JSON数据时...

    jQuery xml-to-json xml转JSON插件

    在上述代码中,`$.xml2json`就是jQuery xml-to-json插件提供的核心函数,它接受XML DOM对象作为参数,返回一个JSON对象。`console.log`则用于打印转换后的JSON字符串,便于查看和调试。 在实际应用中,这个插件尤其...

Global site tag (gtag.js) - Google Analytics