Utilisation de JSON
Convertir le texte JSON en objet JavaScript
L'une des utilisations les plus courantes de JSON est de lire les données JSON à partir d'un serveur Web (sous forme de fichier ou de requête HTTP) et de convertir le Données JSON en Convertir en objet JavaScript et utiliser les données de la page Web.
Pour vous faciliter l'explication, nous utilisons des chaînes comme entrée pour la démonstration (au lieu de fichiers).
Instance JSON - objet à partir d'une chaîne
Crée une chaîne JavaScript contenant la syntaxe JSON :
'{ "firstName": "John" , "lastName": "Doe" },' +
'{ "firstName": "Anna" , "lastName": "Smith" },' +
'{ "firstName":"Peter" , "lastName":"Jones" } ]}';
La syntaxe JSON étant un sous-ensemble de la syntaxe JavaScript, la fonction JavaScript eval() peut être utilisé pour convertir du texte JSON en objets JavaScript. La fonction
eval() utilise le compilateur JavaScript pour analyser le texte JSON puis générer des objets JavaScript. Le texte doit être mis entre crochets pour éviter les erreurs de syntaxe :
dans les pages Web Utiliser JavaScript objets dans :
Instance
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<h2>从 JSON 字符串中创建对象</h2>
<p>
名: <span id="fname"></span><br>
姓: <span id="lname"></span><br>
</p>
<script>
var txt = '{"employees":[' +
'{"firstName":"John","lastName":"Doe" },' +
'{"firstName":"Anna","lastName":"Smith" },' +
'{"firstName":"Peter","lastName":"Jones" }]}';
var obj = eval ("(" + txt + ")");
document.getElementById("fname").innerHTML=obj.employees[1].firstName
document.getElementById("lname").innerHTML=obj.employees[1].lastName
</script>
</body>
</html>Exécuter l'instance»
Cliquez sur le bouton "Exécuter l'instance" pour afficher Exemple en ligne
JSON Parser
La fonction eval() peut compiler et exécuter n'importe quel code JavaScript. Cela cache un problème de sécurité potentiel.
Il est plus sûr d'utiliser un analyseur JSON pour convertir JSON en objets JavaScript. L'analyseur JSON ne comprend que le texte JSON et ne compile pas de scripts.
Dans le navigateur, cela fournit une prise en charge native de JSON et un analyseur JSON plus rapide.
Les navigateurs les plus récents et la dernière norme ECMAScript (JavaScript) incluent la prise en charge native de JSON.
| Prise en charge du navigateur Web | Prise en charge des logiciels Web | < /tr>||||
|---|---|---|---|---|---|
|
|
Instance
<!DOCTYPE html>
<html>
<body>
<h2>Create Object from JSON String</h2>
<p>
First Name: <span id="fname"></span><br>
Last Name: <span id="lname"></span><br>
</p>
<script>
var txt = '{"employees":[' +
'{"firstName":"John","lastName":"Doe" },' +
'{"firstName":"Anna","lastName":"Smith" },' +
'{"firstName":"Peter","lastName":"Jones" }]}';
obj = JSON.parse(txt);
document.getElementById("fname").innerHTML=obj.employees[1].firstName
document.getElementById("lname").innerHTML=obj.employees[1].lastName
</script>
</body>
</html>Exécuter l'instance»
Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne
Pour les navigateurs plus anciens, utilisez la bibliothèque JavaScript : https://github.com/douglascrockford/JSON-js
Le format JSON a été initialement spécifié par Douglas Crockford
