首页html获取json数据

html获取json数据

时间: 2023-08-24 09:12:07 浏览: 192

要在 HTML 中获取 JSON 数据，可以使用 JavaScript 中的 XMLHttpRequest 对象或 Fetch API。使用 XMLHttpRequest 对象： ```html <!DOCTYPE html> <html> <head> <title>获取JSON数据</title> <script> function loadJSON(callback) { var xobj = new XMLHttpRequest(); xobj.overrideMimeType("application/json"); xobj.open('GET', 'data.json', true); xobj.onreadystatechange = function () { if (xobj.readyState == 4 && xobj.status == "200") { callback(JSON.parse(xobj.responseText)); } }; xobj.send(null); } function init() { loadJSON(function(response) { var data = response; // 在这里处理 JSON 数据 }); } window.onload = init; </script> </head> <body>  </body> </html> ``` 使用 Fetch API： ```html <!DOCTYPE html> <html> <head> <title>获取JSON数据</title> <script> function init() { fetch('data.json') .then(response => response.json()) .then(data => { // 在这里处理 JSON 数据 }); } window.onload = init; </script> </head> <body>  </body> </html> ``` 注意：以上代码中的 `data.json` 是一个 JSON 文件的 URL 地址。在使用时需要把它替换成你自己的 URL。

阅读全文