Comment puis-je lire un JSON dans le script-tag à partir de JavaScript?

J'ai une page générée dynamiquement lorsque je veux utiliser un JavaScript statiques et passer une chaîne JSON en tant que paramètre. J'ai vu cette approche utilisée par Google (voir Google +1 Bouton: Comment font-ils?).

Mais comment dois-je lire la chaîne JSON JavaScript?

<html>
  <head>
    <script src="jquery-1.6.2.min.js"></script>
    <script src="myscript.js">{"org": 10, "items":["one","two"]}</script>
  </head>
  <body>
    Hello
  </body>
</html>

Dans ce JavaScript je voudrais utiliser le JSON argument {"org": 10, "items":["one","two"]} du document HTML. Je ne sais pas si c'est mieux de le faire avec jQuery ou sans.

$(function() {
    //read JSON

    alert("the json is:")
})

InformationsquelleAutor Jonas | 2011-09-28

132

Je voudrais changer le script déclaration à ceci:
```
<script id="data" type="application/json">{"org": 10, "items":["one","two"]}</script>
```
Type de Note et les champs id. Après que
```
var data = JSON.parse(document.getElementById('data').innerHTML);
```
fonctionne très bien dans tous les navigateurs.

La type="application/json" est nécessaire pour empêcher le navigateur de l'analyser pendant le chargement.
- Eh bien, je veux que le script-tag point d'un script JavaScript, il n'est donc pas seulement pour JSON. Le JSON est seulement un argument au script.
- Selon la spec HTML5: dev.w3.org/html5/markup/script.html la <script> élément qui a défini la SRC ne doit pas contenir autre chose que de nouvelles lignes et/ou des commentaires. Voir "Un script élément avec un attribut src doit contenir que:" dans le lien ci-dessus. Sinon validateur HTML volonté de se plaindre.
- Parce que jQuery est déjà utilisé par TS, vérifier <script src="jquery-1.6.2.min.js"></script> là.
- J'aime le jquery utilisation. Je veux dire, combien d'autres fractions de millisecondes allez vous raser en utilisant la vanille javascript (dans ce cas)?
- Attention, ce n'est pas sûr, il permet XSS, codepen.io/anon/pen/xevgEM
- C'est vrai pour toute inscription sur la page. La même chose peut être fait avec <style> par exemple. Donc, JSON doit être protégé correctement: </script> -> <\/script> dans les chaînes et la comme.
InformationsquelleAutor c-smile
13

J'ai fini avec ce code JavaScript pour être indépendant de jQuery.
```
var json = document.getElementsByTagName('script');
var myObject = JSON.parse(json[json.length-1].textContent);
```
- Pourquoi ne pas simplement donner le script d'un IDENTIFIANT et d'saisir avec document.getElementById? De cette façon, vous n'avez pas à vous rappeler de garder ce dernier. Ni quiconque d'autre modifications de la page dans l'avenir.
InformationsquelleAutor Jonas

À lire JSON dans <script id="myJSON"> utilisation

var manifest= document.getElementById('myJSON').innerHTML; //sets manifest to the text in #myJSON
manifest= JSON.parse(manifest) //Converts text into JSON

Vous pouvez également utiliser les méthodes de point pour le script comme document.scripts[0]

JS:

    //var manifest= JSON.parse(document.getElementById('myJSON').innerHTML); /*Shortend of 2&3*/
var manifest= document.getElementById('myJSON').innerHTML; //Gets text in #myJSON
manifest= JSON.parse(manifest) //Converts it into JSON
document.getElementById('test').innerHTML= manifest.name+ '<br/>'+ manifest.otherOptions; //Displays it
console.log('manifest')
console.log(manifest);

HTML:

<head>
<script type="application/json" id="myJSON">
  {"name":"Web Starter Kit", "otherOptions":"directly here"}
</script>
</head>
<body>
<p id="test"></p>
</body>

Le <script id="myJSON"> tag a aussi besoin de la type="application/json" attribut.

InformationsquelleAutor Zekrom_Vale

1
```
JSON.parse($('script[src="mysript.js"]').html());
```
ou d'inventer une autre méthode pour identifier le script.

Peut-être lieu de .html() vous pourriez avoir besoin .text(). Pas sûr. Essayer les deux.
- Merci, ça a fonctionné quand j'ai changé le json pour {"org": 10, "items":["one","two"]}
- Cette méthode est mauvaise. Si un <script> balise a src alors il ne DOIT PAS avoir n'importe quel contenu à tous.
InformationsquelleAutor Emil Ivanov

Vous devez vous connecter pour publier un commentaire.