JavaScriptオブジェクトを視覚的にデバッグする

json javascript

以前JSONサービスからオブジェクトを取得して表示するテストツールを作ったのだけど、表示部分の実装を少々作り直してまとめました。

debugobj.js


使い方：

var obj = { a : "hello", b : "javascript", c : [ [ "c11", "c12" ], "c2" ] };

のようなJavaScriptのオブジェクトに対して

var dbgobj = new DebuggableObject(obj);
dbgobj.render(document.getElementById('debugOutput'));

としてやると、オブジェクトの各プロパティを階層的にHTMLテーブルでデバッグ表示します。

デモ：
http://www.geocities.jp/stormriders999/jsdebug.html


これを使って書き直したJSONサービステスト。

http://www.geocities.jp/stormriders999/jsontest.html

現在、Yahoo(USのみ), del.icio.us, Amazon(XSLTで対応), GoogleのJSONサービスをサンプルとして含めています。もちろんこれに限らず任意のJSONサービスをテストできますが、テストできるのはJSONP形式の呼び出しに対応したもののみです。

（追記）
うん、なんかもう似たようなのあったみたい。あとはビジュアルの問題ってことで。
http://nazo.yi.org/nazonojs/?name=objectdump