Comment puis-je lire un JSON dans la balise de script en JavaScript?

Question

Comment puis-je lire un JSON dans la balise de script en JavaScript?

Demandé el 28 de Septembre, 2011: Quand la question a-t-elle été
137985 affichage: Nombre de visites la question a
5 Réponses: Nombre de réponses aux questions
Résolu: Situation réelle de la question

J'ai une page générée dynamiquement où je veux utiliser un JavaScript statique et lui passer une chaîne JSON comme paramètre. J'ai vu cette approche utilisée par Google (voir Google's +1 Button: How do they do it?).

Mais comment devrais-je lire la chaîne JSON depuis le JavaScript ?

    {"org": 10, "items":["one","two"]}

    Hello

Dans ce JavaScript, j'aimerais utiliser l'argument JSON {"org": 10, "items":["one","two"]} du document HTML. Je ne sais pas s'il est préférable de le faire avec jQuery ou sans.

$(function() {
    // lire le JSON

    alert("le JSON est :")
})

Demandé el 28 de Septembre, 2011 par Jonas

Answer 1

5 Réponses

Answer 2

234voto

c-smile Points 8609

Je changerais la déclaration du script comme ceci :

{"org": 10, "items":["one","two"]}

Remarquez les champs type et id. Après cela

var data = JSON.parse(document.getElementById('data').textContent);

fonctionnera très bien dans tous les navigateurs.

Le type="application/json" est nécessaire pour empêcher le navigateur de le parser pendant le chargement.

Et la raison pour laquelle nous utilisons textContent au lieu de innerHTML ou innerText pour lire le texte Json brut est que innerHTML essaie de parser le contenu comme du HTML, ce qui entraînera des performances plus lentes et des bugs de parsing et des attaques XSS possibles, et innerText ne récupérera pas le texte brut et cherchera plutôt du texte visible par l'utilisateur, alors que textContent récupère le texte pur tel quel (ce qui est ce que vous voulez). Consultez https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent pour plus de détails sur pourquoi innerHTML et innerText sont mauvais.

Répondu el 31 de Octobre, 2011 par c-smile (8609 Points )

Answer 3

13voto

Jonas Points 22309

J'ai abouti à ce code JavaScript pour être indépendant de jQuery.

var jsonElement = document.getElementById('json-script-tag');
var myObject = JSON.parse(jsonElement.textContent);

Répondu el 31 de Octobre, 2011 par Jonas (22309 Points )

Answer 4

5voto

Zekrom_Vale Points 174

Pour lire JSON dans </code> utilisez</p> <pre><code>var manifest= document.getElementById('myJSON').innerHTML; //définit manifeste au texte dans #myJSON manifest= JSON.parse(manifest) //Convertit le texte en JSON </code></pre> <p>Vous pouvez également utiliser des méthodes pour pointer vers le script comme <code>document.scripts[0]</code></p> <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false"> <div class="snippet-code"> <pre class="snippet-code-js lang-js prettyprint-override"><code> //var manifest= JSON.parse(document.getElementById('myJSON').innerHTML); /*Version abrégée de 2&3*/ var manifest= document.getElementById('myJSON').innerHTML; //Obtient le texte de #myJSON manifest= JSON.parse(manifest) //Le convertit en JSON document.getElementById('test').innerHTML= manifest.name+ '<br/>'+ manifest.otherOptions; //Le présente console.log('manifest') console.log(manifest);</code></pre> <pre class="snippet-code-html lang-html prettyprint-override"><code><head> <script type="application/json" id="myJSON"> {"name":"Web Starter Kit", "otherOptions":"directement ici"}

Répondu el 24 de Mai, 2017 par Zekrom_Vale (174 Points )

Answer 5

3voto

Emil Ivanov Points 18594

JSON.parse($('script[src="mysript.js"]').html());

ou inventez une autre méthode pour identifier le script.

Peut-être au lieu de .html() vous pourriez avoir besoin de .text(). Pas sûr. Essayez les deux.

Répondu el 28 de Septembre, 2011 par Emil Ivanov (18594 Points )

Answer 6

1voto

Kamil Dąbrowski Points 135

Est-ce que cela fonctionnera comme ça?

var data = JSON.parse(document.getElementById('data').textContent);

Répondu el 13 de Août, 2023 par Kamil Dąbrowski (135 Points )

Comment puis-je lire un JSON dans la balise de script en JavaScript?

Réponses

Questions en vedette

Top Tags

Prograide.com

Powered by:

Comment puis-je lire un JSON dans la balise de script en JavaScript?

Réponses

Questions en vedette

Top Tags

Dans notre réseau

Prograide.com

Powered by: