如何從JavaScript中讀取腳本標記中的JSON？

我有一個動態生成的頁面，我想使用靜態JavaScript並將JSON字符串作爲參數傳遞給它。我看到了Google使用的這種方法（請參閱Google's +1 Button: How do they do it?）。如何從JavaScript中讀取腳本標記中的JSON？

但是我應該如何從JavaScript讀取JSON字符串？

<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，我想從HTML文檔使用JSON參數{"org": 10, "items":["one","two"]}。我不知道最好是用jQuery還是不用。

$(function() { 
    // read JSON 

    alert("the json is:") 
})

來源

2011-09-28 Jonas

100

我將劇本聲明改成這樣：

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

注類型和id字段。之後

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

在所有瀏覽器中都能正常工作。需要使用type="application/json"來防止瀏覽器在加載時解析它。

來源

2011-10-31 16:01:19

嗯，我希望腳本標記指向一個JavaScript，所以它不僅適用於JSON。 JSON只是腳本的一個參數。 – Jonas

根據HTML5規範：http://dev.w3.org/html5/markup/script.html 已定義SRC的''那裏。 –

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

或發明一些其他方法來識別腳本。

也許而不是.html()您可能需要.text()。不確定。試試他們兩個。

來源

2011-09-28 09:38:37

謝謝閱讀JSON，它工作時，我改變了JSON到'{「org」：10，「items」：[「one」，「two」]}' – Jonas

我結束了這個JavaScript代碼獨立於jQuery。

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

來源

2011-10-31 15:53:16 Jonas

+31

爲什麼不給腳本一個ID並用'document.get ElementById'？這樣，你不必記得保持它的最後。未來誰也不會改變網頁。 – George

要<script id="myJSON">使用

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

您還可以使用方法指向腳本像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>

來源

2017-05-24 18:06:18

相關問題

如何從JavaScript中讀取腳本標記中的JSON？

回答

相關問題