JSON.stringify salida a div en forma de impresión bonita


I JSON.stringify un objeto json de

result = JSON.stringify(message, my_json, 2)

El 2 en el argumento anterior se supone que imprime el resultado. Hace esto si hago algo como alert(result). Sin embargo, quiero enviar esto al usuario agregándolo dentro de un div. Cuando hago esto me aparece una sola línea. (No creo que esté funcionando porque los saltos y espacios no están siendo interpretados como html?)

{ "data": { "x": "1", "y": "1", "url": "http://url.com" }, "event": "start", "show": 1, "id": 50 }

¿Hay una manera de generar el resultado de JSON.stringify a un div de una manera de impresión bonita?

Author: Igor Ivancha, 2013-05-31

7 answers

Utilice una etiqueta <pre>

Demo: http://jsfiddle.net/K83cK /

 259
Author: Diode,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-05-31 17:30:28

Asegúrese de que la salida JSON esté en una etiqueta <pre>.

 17
Author: Adam,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-05-31 17:26:08

Divulgación completa Soy el autor de este paquete, pero otra forma de generar objetos JSON o JavaScript de una manera legible completa con la posibilidad de omitir partes, colapsarlas, etc. es nodedump, https://github.com/ragamufin/nodedump

 6
Author: ragamufin,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-01-08 03:26:08

Si esto es realmente para un usuario, mejor que solo enviar texto, puede usar una biblioteca como esta https://github.com/padolsey/prettyprint.js para imprimirlo como una tabla HTML.

 2
Author: Jason Livesay,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-11-19 10:10:04

Tenga en cuenta que su API REST devuelve:

{"Intent":{"Command":"search","SubIntent":null}}

Entonces puedes hacer lo siguiente para imprimirlo en un buen formato:

<pre id="ciResponseText">Output will de displayed here.</pre>   

var ciResponseText = document.getElementById('ciResponseText');
var obj = JSON.parse(http.response);
ciResponseText.innerHTML = JSON.stringify(obj, undefined, 2);   
 1
Author: Siddarth Kanted,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-08-31 19:29:20

Use style white-space: pre la etiqueta <pre> también modifica el formato de texto que puede ser indeseable.

 0
Author: user7986267,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-05-12 19:09:03

Puedes probar este repositorio: https://github.com/amelki/json-pretty-html

 0
Author: kofifus,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-08-01 02:02:20