2011-09-28 18 views
53

Tôi có một trang được tạo động, nơi tôi muốn sử dụng JavaScript tĩnh và chuyển nó một chuỗi JSON làm tham số. Tôi đã thấy cách tiếp cận này được Google sử dụng (xem Google's +1 Button: How do they do it?).Làm cách nào để đọc JSON trong thẻ tập lệnh từ JavaScript?

Nhưng làm cách nào để đọc chuỗi JSON từ 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> 

Trong JavaScript này, tôi muốn sử dụng đối số JSON {"org": 10, "items":["one","two"]} từ tài liệu HTML. Tôi không biết nếu nó là tốt nhất để làm điều đó với jQuery hoặc không có.

$(function() { 
    // read JSON 

    alert("the json is:") 
}) 

Trả lời

100

tôi sẽ thay đổi tuyên bố kịch bản này:

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

loại Note và id lĩnh vực. Sau đó

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

sẽ hoạt động tốt trong tất cả các trình duyệt.

Cần type="application/json" để ngăn trình duyệt phân tích cú pháp khi tải.

+0

Vâng, tôi muốn điểm tập lệnh-thẻ cho một JavaScript, vì vậy nó không chỉ cho JSON. JSON chỉ là một đối số cho tập lệnh. – Jonas

+4

Theo HTML5 spec: http://dev.w3.org/html5/markup/script.html các ' ở đó. –

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

hoặc phát minh ra một số phương pháp khác để xác định kịch bản.

Có thể thay vì .html() bạn có thể cần .text(). Không chắc. Hãy thử cả hai.

+0

Cảm ơn, nó làm việc khi tôi thay đổi json thành '{" org ": 10," mục ": [" một "," hai "]}' – Jonas

14

Tôi đã kết thúc với mã JavaScript này độc lập với jQuery.

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

Tại sao không chỉ cung cấp cho tập lệnh ID và lấy nó bằng 'document.get ElementById'? Bằng cách đó, bạn không cần phải nhớ để giữ cho nó trước. Cũng sẽ không ai thay đổi trang trong tương lai. – George

2

Để đọc JSON trong <script id="myJSON"> sử dụng

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

Bạn cũng có thể sử dụng các phương pháp để trỏ đến các kịch bản như 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>

+0

Thẻ '

Các vấn đề liên quan