【javascript/jQuery】JSON形式のデータの表示確認をする

公開日: : JavaScript/jQuery

スポンサーリンク

PHPであれば「var_dump」や「print_r」などでJSON形式のデータの中身が思い通りの者になっているかどうか簡単に確認することができるのでjavascriptでもそういったのが無いのか探しました。

JSON.stringify

JqueryにあるJSON.stringifyメソッドを使用すればJSONデータを文字列に直すことができます。なので、文字列にしたデータをalertで確認したり、appendやhtmlなど使って要素に追加などして確認することができます。(下例参照)。

ブラウザのデバッグ機能を使う

console.logやconsole.dirを使えば多くのデバッガでその内容を確認することができます。ブラウザによって表示される内容は多少異なるようで、console.dirの方がプロパティを見やすい形にしてくれるようです。

$(function(){
    var obj = {
        田中:{
            id:1,
            year:2012,
            month:12,
            day:8
        },
        山田:{
            id:2,
            year:2013,
            month:4,
            day:23
        },
        佐藤:{
            id:3,
            year:2014,
            month:6,
            day:11
        }
    };

    //1.文字列に変換して確かめる
    var str = JSON.stringify(obj);
    $("body").html(str);

    //2.デバッガで確認する
    //console.log(obj);
    console.dir(obj);
});

結果)
consoledirimg

(※FireFoxのFireBugというデバッガを使用しています)

スポンサーリンク
Amazon
  • このエントリーをはてなブックマークに追加

関連記事

【jQuery UI】タブをクリックしたときのイベントでselectが使えない

jQuery UIは1.10のバージョンではタブをクリックしたときのイベントの名前が変わっているよう

記事を読む

【jQuery UI】Sliderのオプション変更やイベントを取得をする方法

jQuery UIを使ってスライダー(トラックバー)を作ります。その際に起こるイベントとしてスライダ

記事を読む

【jquery】iframe内のスクロールイベント設定とスクロール量取得

ページ内に設置したiframeのスクロールイベントおよびスクロール量を取得したかったのでメモ

記事を読む

AmazonのランキングRSSから画像リンクを作る

Amazon RSS Amazonでいい感じのRSSが無いかと探していたのですが実は本家に素晴らし

記事を読む

【javascript/jQuery】強制的にページをスクロールさせる方法

強制的にページをスクロールさせたいと思って調べていたのですが、なかなか思うようなものが見つからず困っ

記事を読む

Google Maps JavaScript API v3でマップ上に線を引く

GoogleMapsAPIを使って地図上に線を引いたときに気を付けたことなどをメモしておきます。

記事を読む

PHPでページリロードをしようと思ったができなかったので

header("Location: ".$_SERVER); とすればページをリロードでき

記事を読む

javascriptでチェックボックスを一括で変更する方法

チェックボックスのチェックに一つ一つチェックを入れていくのは非常に手間がかかるのでjavascrip

記事を読む

【jQuery UI】タブの初期状態を選択するとエラーがでて失敗する

jQuery UIでタブをプログラム側から選択させるには以下のようなコードを書けばいい…といったこと

記事を読む

【jQuery/javascript】Tweetボタンを動的に設置する

Twitterボタンをブログやサイトに設置するとき読み込みに時間がかかってしまって困るといったことや

記事を読む

NVIDIA DIGITSをSupervisorを使って自動起動する

はじめに 先日Ubuntu14.04にDIGITS 5をGPUなしP

【2017年度】GeForce 1080 Ti搭載BTOパソコン比較

はじめに 最近ディープラーニング用にGPUのないPCにDIGITSを

Windows用のシンプルなストップウォッチソフト紹介

Windows(10)でも使える使いやすいKAZAMITimerという

MNISTをDIGITS 5のCPUのみで試す(GPUなし)

はじめに DIGITSを使えばGUI操作で簡単にディープラーニングが

Windowsユーザが初めてMacBookを購入したときの注意点や感想

最近12インチのMacBookを購入しました。今までWindowsしか

Redmine3.2をUbuntu14.04にインストールして躓いた所についてメモ

はじめに Ubuntu14.04 ServerにRedmine3.2

UWSCを使ったソフト自動立ち上げ【SoftEther VPN Server】

やりたいこと 最近SoftEtherという筑波大学発のベンチャー企業

→もっと見る

  • Author : ががんぼ
    プログラミングやWeb関係で気付いたことについてメモしていく予定。だいたいが備忘録ですが、自分でサンプルを作って動かしてみたりしています。
PAGE TOP ↑