我正在try 添加一些数据到一个网站,我想从一个json文件中获取数据.我想要在整个网站上使用这个文件中的数据.

你能推荐一种方法来帮我取一次吗?这样我就不用多次取了.因为原始文件可能包含超过50,000个数据.

我的json就是这种格式,它存储在服务器上的一个名为

Data.json

[
 {
   "Department": "ABC-1",
   "Date": "03-Jan-22",
   "Name": "Jane Doe",
   "Project": 1,
   "Section": 1,
   "Task_Code": 999,
   "Time": 32,
   "Activity_Code": "1_1"
 },
 {
   "Department": "ABC-2",
   "Date": "03-Jan-22",
   "Name": "Joe Doe",
   "Project": 1,
   "Section": 1,
   "Task_Code": 93,
   "Time": 8,
   "Activity_Code": "1_1"
 },
 {
   "Department": "ABC-2",
   "Date": "03-Jan-22",
   "Name": "Jane Doe",
   "Project": 1,
   "Section": 1,
   "Task_Code": 99,
   "Time": 8,
   "Activity_Code": "1_1"
 },
 {
   "Department": "ABC-1",
   "Date": "03-Jan-22",
   "Name": "Joe Doe",
   "Project": 1,
   "Section": 1,
   "Task_Code": 98,
   "Time": 8,
   "Activity_Code": "1_1"
 },
 {
   "Department": "ABC-2",
   "Date": "03-Jan-22",
   "Name": "Joe Doe",
   "Project": 1,
   "Section": 1,
   "Task_Code": 99,
   "Time": 32,
   "Activity_Code": "1_1"
 },
 {
   "Department": "ABC-1",
   "Date": "03-Jan-22",
   "Name": "Jane Doe",
   "Project": 1,
   "Section": 1,
   "Task_Code": 93,
   "Time": 8,
   "Activity_Code": "1_1"
 }
]

我已经写了一个测试hscript.js文件来解析json.我能够获取脚本文件中的文件,但当我try 调用网页中的变量时,它无法识别变量.

index.html

`<!DOCTYPE html>
<html lang="en">
<head>
<!--script src="js/hscript.js"></script-->

</head>
<body>
File Active
<!--script type="module" src="js\index.js"></script-->

<script type="module" src="js/hscript.js"> </script>
<script >
console.log(dataset.length); /variable not returning any value
</script>


</body>`

hscript.js

fetch('../js/Data.json')
  .then(response => response.json())
  .then(data => console.log(data.length)) //here i get the Console data

当我运行上面的代码时,我会根据代码中的注释获得控制台输出.

我对jQuery的了解很少,请帮忙.

推荐答案

问题是,在您的AJAX调用完成之前,您的console.log就被执行了.您应该进行以下更改:

#1在hscript.js调用之前添加一个名为onDataReady的函数:

<script>
function onDataReady(data) {
  console.log(data.length)
}
</script>

#2更新hscript.js代码,以便在获取数据后调用onDataReady:

fetch('../js/data.json')
  .then(response => response.json())
  .then(data => onDataReady(data))

Javascript相关问答推荐

如何使用JavaScript用等效的功能性HTML替换标记URL格式?

窗口.getComputedStyle()在MutationObserver中不起作用

Google Apps脚本中的discord邀请API响应的日期解析问题

我开始使用/url?q=使用Cheerio

Exceljs:我们在file.xlsx(...)&#中发现了一个问题'"" 39人;

在我的html表单中的用户输入没有被传送到我的google表单中

WebGL 2.0无符号整数输入变量

查找最长的子序列-无法重置数组

如何根据当前打开的BottomTab Screeb动态加载React组件?

如何控制Reaction路由加载器中的错误状态?

Ember.js 5.4更新会话存储时如何更新组件变量

类构造函数不能在没有用With Router包装的情况下调用

如何在Node.js中排除导出的JS文件

使用线性插值法旋转直线以查看鼠标会导致 skip

用Reaction-RT-Chart创建实时条形图

是否设置以JavaScript为背景的画布元素?

我的NavLink活动类在REACT-ROUTER-V6中出现问题

我在哪里添加过滤器值到这个函数?

如何用react组件替换dom元素?

带有JS模块模式的Rails的Importmap错误:";Net::ERR_ABORTED 404(未找到)&Quot;