Как я могу прочитать JSON в script -tag из JavaScript?

У меня есть динамически сгенерированная страница, где я хочу использовать статический JavaScript и передавать ему строку JSON в качестве параметра. Я видел этот подход, используемый Google (см. Кнопка Google +1: как это сделать?).

Но как мне читать строку 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>

В этом JavaScript я хотел бы использовать аргумент JSON {"org": 10, "items":["one","two"]} из документа HTML. Я не знаю, лучше ли это сделать с помощью jQuery или без него.

$(function() {
    // read JSON

    alert("the json is:")
})

Ответы

Ответ 1

Я бы изменил объявление script на это:

<script id="data" type="application/json">{"org": 10, "items":["one","two"]}</script>

Поля типа и идентификатора. После этого

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

будет работать отлично во всех браузерах.

type="application/json" необходим для предотвращения разбора браузера во время загрузки.

Ответ 2

Я закончил тем, что этот код JavaScript не зависит от jQuery.

var json = document.getElementsByTagName('script');
var myObject = JSON.parse(json[json.length-1].textContent);

Ответ 3

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

или придумайте какой-либо другой метод для идентификации script.

Возможно, вместо .html() вам может понадобиться .text(). Не уверен. Попробуйте их обоих.

Ответ 4

Чтобы прочитать JSON в <script id="myJSON">, используйте

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

Вы также можете использовать методы для указания на script как document.scripts[0]

    //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);

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