现在的位置: 首页 > 综合 > 正文

使用VS和IE调试Json

2013年10月22日 ⁄ 综合 ⁄ 共 1532字 ⁄ 字号 评论关闭

 

使用VSIE调试Json

 

1.       必须启用IE的脚本调试功能:

 

    

 


2.       启动IE,在调试之前首先打开要调试的页面,我这里的demoJSONUnitTest.html

下面是JSONUnitTest.html的源代码:

<html>

    <head>

    <title>JSon数据格式</title>

        <script type="text/javascript">

        function doJsonTest(){

            var value = document.getElementById("txtJson").value;

            var jObj = eval(value);

           

            var i;

        }

        </script>

    </head>

    <body>

        <input type="button" id="btnTest" onclick="doJsonTest()" value="Go" /><br />

        <textarea id="txtJson" cols="200" rows="10"></textarea>

    </body>

</html>

 

这里有几个地方是需要注意的:

1)   我使用的textarea的方式输入文本,主要是因为可能需要测试的数据长度比较大。

2)   当点击按钮的时候,触发JavaScriptdoJsonTest()方法。

3)   doJsonTest()方法中,首先获取文本框的值,然后转换改变量的json数据形式值,使用eval()方法。

3.       VS中打开JSONUnitTest.html

设置断点。

为了便于查看,我们再定义一个变量i,这样可以很容易的查看json数据值。

 

4.       测试数据,使用QuicklyWatch查看:

对于json的数据格式,大家可以参考:

http://www.json.org/

我们首先测试一个比较简单的:

1)       在文本框输入 [{a:123}]

2)       vs中“附加到进程”,选择要调试的JSONUnitTest.html这个页面

此时,你会发现断点已经发生作用了。

3)       点击页面按钮,此时将触发按键的onclick的事件,调用JavaScriptdoJsonTest()方法。

4)       使用QuicklyWatch查看:

在变量值上点右键,选择QuicklyWatch

 

 

 

这时,你就可以看到json的数据是什么模样的了:

 

 

5)       下面,我们再测试数组形式的,这个也是json数据格式所支持的:

在文本框输入:

[{"name":"wuhao","age":28},{"name":"linchun","age":26},{"name":"chunyan","age":25}]

同样的方法调试,查看

    

 

 

为什么选择json,这是我之前一直比较困惑的问题。我们在QuicklyWatch中输入jObj[2].name,你会惊奇的发现

 

    

 

         是的,我们可以通过序列轻松的访问json数据的任何对象、以及其任何属性,做到“数据与显示相分离,按需取得数据”。

 

相关文档还可以参考:

Responding to and replying with JSON in your server-side scripts and programs

http://www.ibm.com/developerworks/web/library/wa-ajaxintro11.html?S_TACT=105AGX08&S_CMP=EDU

抱歉!评论已关闭.