oujood.com

JSON Comment convertir un texte JSON à un objet JavaScript

Une utilisation la plus courante de JSON est d'extraire les données JSON d'un serveur web (comme un fichier ou comme un HttpRequest)
JSON ou JavaScript Object Notation est une norme ouverte légère basée sur le texte, conçue pour l'échange de données lisibles par l'homme. Les conventions utilisées par JSON sont connues des programmeurs, notamment C, C++, Java, Python, Perl, etc

search |

convertir un texte JSON à un objet JavaScript


COURS tutoriel JSON

Une utilisation la plus courante de JSON est d'extraire les données JSON d'un serveur web (comme un fichier ou comme un HttpRequest), convertir les données JSON à un objet JavaScript, et utilise ensuite les données dans une page web.

Pour plus de simplicité, il peut être démontré en utilisant une chaîne en entrée (au lieu d'un fichier).

Exemple JSON - objet chaîne

Créer une chaîne de JavaScript contenant la syntaxe JSON :

var txt = '{ "employées" : [' +
'{ "prenom":"Jenifère" , "Nom":"Du bois" },' +
'{ "prenom":"Amal" , "Nom":"Sami" },' +
'{ "prenom":"Piére" , "Nom":"Jolie" } ]}';

Puisque la syntaxe JSON est un sous-ensemble de la syntaxe JavaScript, la fonction eval() de JavaScript peut être utilisé pour convertir un texte JSON en un objet JavaScript.

La fonction eval() utilise le compilateur JavaScript qui va analyser le texte JSON et produire un objet JavaScript. Le texte doit être enveloppé dans la parenthèse pour éviter une erreur de syntaxe :

var obj = eval ("(" + txt + ")");

Exemple Utilisez l'objet JavaScript dans votre page :

Sélectionner le code

  <!doctype html>
  <html lang="fr">
  <head>
           <meta charset="UTF-8">
           <title>Creation d'objet dans javascript en
  utilisant une chaine JSON</title>
  </head>
  <body>
  <h2>Creater un Objet à partir d'une une chaine
  JSON</h2>
  <p>
  Prénom: <span id="pnom"></span><br>
  Nom: <span id="nom"></span><br>
  </p>
  <script>
  var txt = '{"employées":[' +
  '{"prenom":"Jenifère","Nom":"Du bois"},' +
  '{"prenom":"Amal","Nom":"Sami"},' +
  '{"prenom":"Piére","Nom":"Jolie"}]}';
   
  var obj = eval ("(" + txt + ")");
   
  document.getElementById("pnom").innerHTML=obj.employées[1].prenom
  document.getElementById("nom").innerHTML=obj.employées[1].Nom
  </script>
   
  </body>
  </html>

 

ANALYSEUR JSON

lampLa fonction eval() peut compiler et exécuter n'importe quel JavaScript. Mai si il s'agit d'un problème de sécurité potentiel.

Il est plus sûr d'utiliser un analyseur JSON pour convertir un texte JSON à un objet JavaScript.

Un analyseur JSON reconnaîtra uniquement le texte JSON et ne compile pas les scripts.

Dans les navigateurs qui fournissent JSON natif. les analyseurs JSON sont également plus rapides.

Prise en charge native de JSON est inclus dans les navigateurs récents et dans la nouvelle norme ECMAScript (JavaScript).

Support Navigateur Web   Support logiciel
Firefox (Mozilla) 3.5
Internet Explorer 8
Chrome
Opera 10
Safari 4
jQuery
Yahoo UI
Prototype
Dojo
ECMAScript 1.5

Exemple Créer un Objet à partir d'une une chaine JSON

Sélectionner le code

  <!doctype html>
  <html lang="fr">
  <head>
           <meta charset="UTF-8">
           <title>Creation d'objet dans javascript en
  utilisant une chaine JSON</title>
  </head>
  <body>
  <h2>Créer un Objet à partir d'une une chaine
  JSON</h2>
  <br>
  <script>
  var txt = '{"employées":[' +
  '{"prenom":"Jenifère","Nom":"Du bois"},' +
  '{"prenom":"Amal","Nom":"Sami"},' +
  '{"prenom":"Piére","Nom":"Jolie"}]}';
   
  var obj = eval ("(" + txt + ")");
  for(i=0;i<obj.employées.length;i++){
  document.writeln("Prénom : "+obj.employées[i].prenom+" " );
  document.writeln(" Nom :
  "+obj.employées[i].Nom+"<br><br>"); }
  </script>
  </body>
  </html>

 

Pour les navigateurs plus anciens, une bibliothèque JavaScript est disponible à https://github.com/douglascrockford/JSON-js

Le format JSON est spécifiée à l'origine par Douglas Crockford

Par carabde 2 novembre 2014

Trafic Booster
hebergement web

SCREEBER - Logiciel de copywriting

SCREEBER - Logiciel de copywriting Augmentez vos résultats en rejoignant les 1600 entrepreneurs qui utilisent Screeber®, le seul logiciel de Copywriting (en français) qui rédige avec vous des textes de vente qui convertissent


HTML5, CSS3, JavaScript pour débutants Tome 1
HTML5, CSS3, JavaScript
pour débutants Tome 1

Premier tome d'une série vidéo dédiée à l'apprentissage des langages HTML, CSS et JavaScript.

Regarder aussi nos cours :

La librairie GD creation d'une image

La librairie GD creation d'une image

:first-child

Ajoute un style à un élément qui est le premier enfant d'un autre élément

liste des fonctions GD

liste des fonctions GD



Rentabilisez efficacement votre site

Votre soutien nous aide à faire fonctionner le site
Cette page vous a été utile? Partagez la pour nous encourager à continuer. Merci