在JavaScript中加载本地JSON文件,可以通过以下几种方式实现:
var xhr = new XMLHttpRequest();
xhr.open('GET', 'path/to/your/file.json', true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var data = JSON.parse(xhr.responseText);
console.log(data);
}
};
xhr.send();
fetch('path/to/your/file.json')
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('Error:', error));
<input type="file" id="jsonFileInput">
document.getElementById('jsonFileInput').addEventListener('change', function(event) {
var file = event.target.files[0];
if (file) {
var reader = new FileReader();
reader.onload = function(e) {
var contents = e.target.result;
var data = JSON.parse(contents);
console.log(data);
};
reader.readAsText(file);
}
});
http-server
模块或Python的SimpleHTTPServer
模块。如果你在本地开发环境中遇到跨域问题,可以使用以下方法之一:
# 使用http-server模块
npx http-server
# 或者使用Python 3
python -m http.server 8000
通过这些方法,你可以成功加载本地JSON文件并在JavaScript中使用其数据。
领取专属 10元无门槛券
手把手带您无忧上云