2016-12-01 5 views
0

Как я могу получить данные JSON, встроенные в тег скрипта?Чтение JSON от <script> Тег

<!DOCTYPE html> 
<html> 
    <head> 
     <script id="data" type="application/json">{org: 10, items:['one','two']}</script> 
     <script type="text/javascript"> 
      var obj = JSON.parse(document.getElementById('data').value); 
      console.log(obj); 
      console.log(obj.org); 
     </script> 
    </head> 
    <body> 
    </body> 
</html> 

Я получаю:

неперехваченного SyntaxError: Неожиданный токен у в формате JSON в позиции 0

ответ

6

элементы не являются элементами управления формами. У них нет value свойств (поэтому, когда вы его читаете, вы получаете undefined, который равен "undefined", когда выбрасываете строку, и это недействительно JSON).

Прочитайте содержимое текстового узла внутри элемента.

Вам также нужно написать JSON вместо литерала объекта JavaScript.

  • Имена объектов должны быть строками, а не идентификаторами.
  • Строки должны быть указаны в " не '.

<script id="data" type="application/json">{"org": 10, "items":["one","two"]}</script> 
 
<script type="text/javascript"> 
 
var obj = JSON.parse(document.getElementById('data').firstChild.data); 
 
    console.log(obj); 
 
    console.log(obj.org); 
 
</script>

+0

Почему FirstChild используется, когда тег сценария не имеет дочерних элементов, только данные? –

+0

@GTSJoe - доступ к текстовому узлу внутри узла элемента. – Quentin

+0

Есть ли преимущества для этого только при использовании document.getElementById ('data'). Text? –

0

u The происходит от "неопределенного". Попытайтесь:

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

... но имейте в виду, что ваш текущий вход не является JSON. Поэтому правильно отформатировано было бы:

<script id="data" type="application/json">{"org":10,"items":["one","two"]}</script> 
Смежные вопросы