Javascript 搜索一个或多个州的公园

我是一个新的开发人员，希望有更多经验的人提供帮助。我试图了解如何使用api/端点我创建了一个密钥，现在我试图让我的应用程序搜索一个或多个州的公园，并显示全名和描述。这是api文档。我希望我的问题问得足够好，我愿意接受建设性的批评

API（请在新选项卡中复制并粘贴链接）

“严格使用”；
//把你自己的价值放在下面！
常数apiKey=''；
常量搜索URL=https://developer.nps.gov/api/v1/parks?parkCode=acad&';
函数formatQueryParams（参数）{
const queryItems=Object.keys（参数）
.map（key=>`${encodeURIComponent（key）}=${encodeURIComponent（params[key]）}`）
返回queryItems.join（'&'）；
}
函数显示结果（responseJson）{
//如果有以前的结果，请删除它们
console.log（responseJson）；
$（“#结果列表”）.empty（）；
//遍历items数组
for（设i=0；i${responseJson.items[i].snippet.title}
${responseJson.items[i].snippet.description}

`
)};
//显示结果部分
$（“#结果”）.removeClass（'hidden'）；
};
函数getYouTubeVideos（查询，maxResults=10）{
常量参数={
键：apiKey，
问:质疑,，
部分：'代码片段'，
maxResults，
键入：“视频”
};
常量queryString=formatQueryParams（参数）
constURL=searchURL+'？'+queryString；
console.log（url）；
获取（url）
。然后（响应=>{
if（response.ok）{
返回response.json（）；
}
抛出新错误（response.statusText）；
})
.然后（responseJson=>displayResults（responseJson））
.catch（错误=>{
$（'#js error message'）.text（`Something hourg:${err.message}`）；
});
}
函数watchForm（）{
$（'form'）。提交（事件=>{
event.preventDefault（）；
const searchTerm=$（'#js searchTerm'）.val（）；
常量maxResults=$（'#js max results'）.val（）；
getYouTubeVideos（搜索术语，maxResults）；
});
}
元(表);
*{
框大小：边框框；
}
身体{
字体系列：“Roboto”，无衬线；
}
按钮，输入[type=“text”]{
填充物：5px；
}
按钮：悬停{
光标：指针；
}
.集装箱{
最大宽度：600px；
保证金：0自动；
}
.错误消息{
颜色：红色；
}
.隐藏{
显示：无；
}

YouTube视频查找器
公园发现者
搜索词
返回的最大结果数

搜索结果


我可以看到一些事情正在发生，我有一些调试建议。另外，我建议清理Javascript，使其没有YouTube引用

当您获取（url）第一个。然后返回json结果，但您对函数的调用对结果没有任何影响。想必你会调用displayResults，但你还没有这么做（还没有？）。因此，至少需要控制台log response.json来查看发生了什么

你用的是两个。那是不正确的。第一个从函数返回，因此第二个永远不会被调用。去掉then，然后将代码移到first-then

调试建议-当你在某件事情上陷入困境时，最好将其分解为几个小步骤，从头到尾检查行为


您是否生成了正确的查询url？你已经把它记录下来了，这很好。复制url并粘贴到浏览器中。你回来了吗？如果没有，请一步一步地完成url构建过程。这提醒了我，请确保使用api密钥，它在代码中设置为“”

检查代码返回的json是否与从浏览器获得的json相同，如果不是，请检查浏览器调用和获取之间是否有任何不同

这应该让你越过了你被困的地方。下一步是检查显示功能，等等

我可以看到一些事情正在发生，我有一些调试建议。另外，我建议清理Javascript，使其没有YouTube引用

当您获取（url）第一个。然后返回json结果，但您对函数的调用对结果没有任何影响。想必你会调用displayResults，但你还没有这么做（还没有？）。因此，至少需要控制台log response.json来查看发生了什么

你用的是两个。那是不正确的。第一个从函数返回，因此第二个永远不会被调用。去掉then，然后将代码移到first-then

调试建议-当你在某件事情上陷入困境时，最好将其分解为几个小步骤，从头到尾检查行为


您是否生成了正确的查询url？你已经把它记录下来了，这很好。复制url并粘贴到浏览器中。你回来了吗？如果没有，请一步一步地完成url构建过程。这提醒了我，请确保使用api密钥，它在代码中设置为“”

检查代码返回的json是否与从浏览器获得的json相同，如果不是，请检查浏览器调用和获取之间是否有任何不同

这应该让你越过了你被困的地方。下一步是检查显示功能，等等

您能告诉我们您在尝试运行代码时收到的错误类型吗？或者你到底需要澄清什么？另外，当您在末尾调用函数时，它应该是
watchForm（）当我运行它时，我只在控制台中获得url和api。对于