jQueryでPHPのprint_r(),var_dump()する方法!
PHPで使用するprint_r()やvar_dump()は非常に便利です。
配列や変数の中身を視覚的に見られるのでPHPでの開発中には頻繁に利用すると思います。
ただ、それがJavaScriptではできないので作りました。
以下のコードをprint_r.jsとして保存してください。
print_r.js
(function($) { $.extend({ print_r: function print_r( obj, dst) { function dump(arr,level) { var ret = ""; if(!level) level = 0; if(level >= 30) { return "Nesting too deep\n"; } //The padding given at the beginning of the line. var level_padding = ""; for(var j=0;j<level;j++) level_padding += " "; if(arr == null) { //null ret = "null\n"; } else if(typeof(arr) == 'object') { //Array/Hashes/Objects if (arr.constructor == Array) { ret += level_padding + "Array\n"; } else if ( arr.constructor == Object ) { ret += level_padding + "Object\n"; } else { ret += level_padding + "Other " + arr.toString() + "\n"; return ret; } ret += level_padding + "(\n"; for(var item in arr) { var value = arr[item]; if(typeof(value) == 'object') { //If it is an array, ret += level_padding + " [" + item + "] =>\n"; ret += dump(value,level+2); } else { ret += level_padding + " [" + item + "] => " + value + "\n"; } } ret += level_padding + ")\n"; } else if(typeof(arr) == 'function') { // function ret = arr+"\n"; } else { //Stings/Chars/Numbers etc. ret = arr+"\n"; } return ret; } function parseStr( src) { src = src.replace(/&/g, "&"); src = src.replace(/ /g, " "); src = src.replace(/</g, "<"); src = src.replace(/>/g, ">"); src = src.replace(/\n/g, "<br />"); return src; } if (typeof(dst) == "undefined") { $("body").append(parseStr(dump(obj))); } else if (typeof(dst) == "string") { $("#" + dst).append(parseStr(dump(obj))); } else if (typeof(dst) == "boolean" && dst == true) { alert(dump(obj)); } } }); })(jQuery);
その後、
<script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="print_r.js"></script> <script type="text/javascript" src="script.js"></script>
のように読み込んで、script.jsで、
script.js
$(function(){ var json = [ {"A":"apple","B":"orange","C":"banana"}, {"A":"piano","B":"guiter","C":"viorin"}, {"A":"table","B":"bed","C":"bath"}, ]; $.print_r(json); );
のような形で使用します。
第2引数については
指定なし : documentに書き出す
id名を指定 : 指定したidのタグに出力
trueを指定 : alert()で出力する
です。