Parse JSON in jQuery
JSON (JavaScript Object Notation) is a lightweight data-interchange format to parse and generate.
If you’re working with JSON data in jQuery, you can parse the data into a JavaScript object using the $.parseJSON() method.
In this article, we’ll take a look at how to use this method to parse JSON data in jQuery.
Parsing JSON in jQuery using parseJSON()
jQuery allows parsing JSON using parseJSON() method.
The parseJSON() method in jQuery internally uses the Javascript parse() method.
parseJSON() example
<html>
<head>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
var jsonStr = '{"sitename":"TopJavaTutorial","url":"www.topjavatutorial.com"}';
var siteDetails = $.parseJSON(jsonStr);
document.getElementById("name").innerHTML = siteDetails.sitename;
document.getElementById("address").innerHTML = siteDetails.url;
});
</script>
</head>
<body>
<h2>jQuery parseJSON() example</h2>
<p id="name">Site name here</p>
<p id="address">Site address here</p>
</body>
</html>
Output
Edit in fiddle here
In this example, the JSON data is stored in a string, jsonString. The $.parseJSON() method is used to parse the string and convert it into a JavaScript object. Once the JSON data has been parsed, you can access its properties just like any other object.
Handling errors:
It’s important to note that the $.parseJSON() method only works with valid JSON data. If the data is not valid JSON, the method will throw an error. To avoid this, you should always validate your JSON data before trying to parse it.
var jsonString = '{"name": "John Doe", "age": 35'; // Invalid JSON
try {
var obj = $.parseJSON(jsonString);
} catch (e) {
console.error(e); // Output: "SyntaxError: Unexpected end of JSON input"
}
© 2016 – 2023, https:. All rights reserved. On republishing this post, you must provide link to original post
