web-dev-qa-db-fra.com

jQuery: print_r () display équivalent?

Duplicate possible:
format de données JavaScript/jolie imprimante

Je commence à être un peu fatigué de regarder des blobs Json non formatés dans FireBug.

Est-ce que quelqu'un connaît l'équivalent de print_r () de PHP pour jQuery?

Quelque chose qui créerait de manière récursive une chaîne d'affichage à partir d'un objet ou d'un tableau, que je pourrais afficher sur la page pour un débogage rapide?

Merci!

64
Eli

console.log est ce que j’utilise le plus souvent lors du débogage.

J'ai pu trouver ceci jQuery extension bien que.

69
Paolo Bergantino

Vous pouvez utiliser très facilement réflexion pour lister toutes les propriétés, méthodes et valeurs.

Pour les navigateurs basés sur Gecko, vous pouvez utiliser la méthode .toSource ():

var data = new Object();
data["firstname"] = "John";
data["lastname"] = "Smith";
data["age"] = 21;

alert(data.toSource()); //Will return "({firstname:"John", lastname:"Smith", age:21})"

Mais puisque vous utilisez Firebug, pourquoi ne pas utiliser simplement console.log?

44
CMS

Que diriez-vous de quelque chose comme:

<script src='http://code.jquery.com/jquery-latest.js'></script>

function print_r(o){
return JSON.stringify(o,null,'\t').replace(/\n/g,'<br>').replace(/\t/g,'&nbsp;&nbsp;&nbsp;'); }
16
Magnus Andersson

Tu peux aussi faire

console.log("a = %o, b = %o", a, b);

où a et b sont des objets.

9
Bill Zeller

J'ai créé un plugin jQuery pour l'équivalent de

<pre>
<?php echo print_r($data) ?>
</pre>

Vous pouvez le télécharger sur https://github.com/tomasvanrijsse/jQuery.dump

6
Tomas

Le commentaire en haut a un lien brisé avec la documentation console.log pour Firebug. Voici donc n lien vers l'article du wiki sur la console . J'ai commencé à l'utiliser et je suis assez satisfait comme alternative à PHP print_r ().

A noter également que Firebug vous donne accès aux objets JSON renvoyés même sans que vous les enregistriez manuellement:

  • Dans la console, vous pouvez voir l'URL de la réponse AJAX.
  • Cliquez sur le triangle pour développer la réponse et voir les détails.
  • Cliquez sur l'onglet JSON dans les détails.
  • Vous verrez les données de réponse organisées avec des triangles d'expansion.

Cette méthode nécessite quelques clics supplémentaires pour obtenir les données, mais ne nécessite aucun ajout de votre javascript ni ne déplace votre focus dans Firebug de la console (en utilisant console.log, vous créez un lien vers la section DOM de firebug. , vous obligeant à revenir à la console après).

Pour mon argent, je préférerais cliquer plusieurs fois de plus quand je veux inspecter plutôt que de perdre son temps avec le journal, d'autant plus que la console est soignée en évitant d'ajouter des données inutiles.

5
jerclarke
$.each(myobject, function(key, element) {
    alert('key: ' + key + '\n' + 'value: ' + element);
});

Cela fait le travail pour moi. :)

5
Gogol