কম্পিউটার টিউটোরিয়াল

জাভাস্ক্রিপ্টে টেক্সটএরিয়াতে JSON ডেটা প্রিটিফাই করা

JSON.parse() এবং JSON.stringify(obj, null, 4) ব্যবহার করে অনফরম্যাটেড JSON কে সুন্দরভাবে ফরম্যাট করা যায়।

উদাহরণ

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="UTF-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<title>Document</title> 
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
<script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fontawesome/4.7.0/css/font-awesome.min.css"> 
</head> 
<body> 
<textarea id="prettyJSONFormat" cols="100" rows="20"></textarea> 
<button onclick="printTheJSONInPrettyFormat()">Click The Button To get the Pretty JSON</button> 
<script> 
    function printTheJSONInPrettyFormat() { 
        var badJSON = document.getElementById('prettyJSONFormat').value; 
        var parseJSON = JSON.parse(badJSON); 
        var JSONInPrettyFormat = JSON.stringify(parseJSON, undefined, 4); 
        document.getElementById('prettyJSONFormat').value = JSONInPrettyFormat; 
    } 
</script> 
</body> 
</html>

Live Server দিয়ে চালান। টেক্সটএরিয়ায় খারাপ JSON পেস্ট করে বাটন চাপলে ফরম্যাটেড JSON পাবেন।

আউটপুট

বাটন ক্লিক করলে JSON ইনডেন্টেশন সহ সুন্দর ফরম্যাটে দেখাবে।

  1. জাভাস্ক্রিপ্ট ব্যবহার করে JSON অ্যারে থেকে ডেটা পড়া

  2. জাভাস্ক্রিপ্টে টাইপ করার সাথে সাথে HTML টেক্সট ইনপুট ফিল্ড বড়ানো

  3. জাভাস্ক্রিপ্টে ফাংশনের রেজাল্ট HTML আকারে দেখানো

  4. জাভাস্ক্রিপ্টে ID দিয়ে এলিমেন্ট রিমুভ করা