The method of displaying json data by jQuery plug-in jsonview

Most people do not understand the knowledge points of this article "jQuery plug-in jsonview shows json data", so the editor summarizes the following contents, detailed contents, clear steps, and has a certain reference value. I hope you can get something after reading this article. Let's take a look at this "jQuery plug-in jsonview shows json data method" article.

First of all, go to the jquery official website to download the latest jsonview plug-in, put it in the js directory, download address.

Second, add the following code to html:

JSON data folding, unfolding and saving

Then, add the js control method to js:

Var raw_json = $("# json_data"). Val (); var json = JSON.parse (raw_json); $(function () {$("# json") .JSONView (json); $("# json-collapsed") .JSONView (json, {collapsed: true, nl2br: true}); $('# collapse-btn'). On ('click', function () {$(' # json'). JSONView ('collapse');}) $('# expand-btn') .on ('click', function () {$(' # json'). JSONView ('expand');})

You can automatically parse json to add html style to it, and jquery.jsonview.js is also a plug-in tool written by jquery, which can be modified according to your own needs. The final results are shown as follows:

The above is about the content of this article on "the method of displaying json data by jQuery plug-in jsonview". I believe we all have a certain understanding. I hope the content shared by the editor will be helpful to you. If you want to know more about the relevant knowledge, please follow the industry information channel.