从外部 Javascript 文件访问数据

Access data from an external Javascript file

本文关键字:数据 访问 文件 Javascript 从外部      更新时间:2023-09-26

我有存储在外部Javascript文件中的数据。

它看起来像这样,

window.videos = [{
    "name": "Sample data",
    "duration": 154,
    "description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras hendrerit tempor velit.",
    "tags": ["modern-society",
    "ABC"]
},
{
    "name": "Sample data",
    "duration": 2659,
    "description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras hendrerit tempor velit.",
    "category": "Senior->English",
    "tags": ["China"]
}];

这是什么?是 JSON 还是对象?

我需要访问并从此文件中检索名称和描述,并将其显示在我的HTML中,我该怎么做?

您发布的代码正在创建一个 javascript 对象,但如果您删除window.videos =,您也有一个有效的 JSON 文档。(两者非常相似)

假设您将代码保持原样,并将其放入名为 video-data.js 的文件中。

运行此脚本后,window.videos将包含您指定的视频数据。

如果你想从javascript中取出这些数据并以HTML显示,可以遍历数组并在页面上构造一些元素。

window.videos = [{
  "name": "Sample data",
  "duration": 154,
  "description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras hendrerit tempor velit.",
  "tags": ["modern-society",
    "ABC"
  ]
}, {
  "name": "Sample data",
  "duration": 2659,
  "description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras hendrerit tempor velit.",
  "category": "Senior->English",
  "tags": ["China"]
}];
videos.forEach(function(video) {
  var videoElement = document.createElement('p');
  videoElement.innerHTML = '<strong>' + video.name + '</strong>: <i>' + video.description + '</i>';
  document.body.appendChild(videoElement);
});