通过香草Javascript在模式中加载JSON数据



我被项目的下一步卡住了,我在原地打转。在隔离(即静态页面)我可以弄清楚如何让事情工作,但处理JSON API的动态数据真的让我很困惑。

这是我在哪里;

-我有一个工作页面,链接到一个JSON API和所有相关的元素填充(文本字段&图像数组中的第一张图像),您可以在下面的CodePen链接中看到。模态当前是通过点击信息图标来访问的,并且包含静态内容。

我现在想继续在Modal中创建以下元素;

a)创建一个灯箱画廊,以便能够查看页面上每艘船的数组中的附加图像。
b)在灯箱画廊下方显示每艘船的附加信息(包含在JSON提要中)。

但在我这样做之前,我需要理解…

问题
  1. 如何最好地访问JSON数组通过模态?

My Thoughts
a)我已经调用了API数据,当然我仍然可以访问JSON数据?它是在内存中,它是存储的…
b)我应该添加一个类/标签/id的"信息图标"当我调用loadTableData(boatData)函数,以便我可以从openModal()函数访问/调用每个单独的船,即openModal(boatId)
b)如果我再次调用API数据,我是低效的!!

CodePen联系看笔船只数据-当前库存/Michael Brewer (@m1ck5k1)CodePen。

为什么不将获取的数据保存在变量中并操作它来填充模型或尝试使用ajax !!

最新更新