所以,问题是我似乎无法理解为什么这个功能不能正常工作。这是我在国家公园做的API。我想也许另一组眼睛可能会注意到我没有的东西。我没有编程很长时间,并将一切视为一种学习体验。
提前致谢。
我尝试了很多东西,似乎没有一个能正常工作。我是编程新手。
function showResults(responseJson, params) {
$('.results-list').empty();
let html = '';
for (let i = 0; i < responseJson.data.length; i++) {
const park = responseJson.data[i];
const description = park.description;
const name = park.name;
const url = park.url;
const address = park.directionInfo;
html += `
<li><h3>${name}</h3>
<p>Description: ${description}</p>
<p>Link: <a href="${url}">${URL}</a></p>
<p>Address: ${address}</p>
</li>`;
console.log('ugh');
}
$('.results-list').html(html);
$('.results-page').removeClass('hidden');
}
function parkResults(query, highResult = 10) {
highResult -= 1;
const params = {
api_key: apiKey,
limit: highResult,
stateCode: query
};
const queryString = formatQueryParams(params);
const url = searchURL + '?' + queryString;
fetch(url)
.then(response => {
if (response.ok) {
return response.json();
}
throw new Error(response.statusText);
})
.then(responseJson => showResults(responseJson, query))
.catch(err => {
$('.error-message').text(`Error:${err.message}`);
console.log('?');
});
}
根据console.log,该函数无法正常工作,但它没有显示任何错误。所以,我有点迷失在这一点上。我只是希望该功能正常工作。
这段代码工作正常。我已经将代码简化为其他人可以使用和复制的东西。 fetch(...)
看起来很好,所以我建议你查看你的URL和输出格式的weirnesses。
注意,我删除了任何范围声明以及多行字符串格式(反引号)。您可以根据需要随意添加它们。
<html>
<body>
<p id="results-list">Please wait...</p>
<script>
function showResults(json) {
var element = document.getElementById('results-list');
element.innerHTML = '';
var html = '';
for (var i = 0; i < json.data.length; i++) {
var park = json.data[i];
html += '<li><h3>' + park.name + '</h3>' +
'<p>Description: ' + park.description + '</p>' +
'<p>Link: <a href="' + park.url + '">' + park.url + '</a></p>' +
'<p>Address: ' + park.directionInfo + '</p>' +
'</li>';
}
element.innerHTML = html;
}
function fetchPark() {
var url = 'https://developer.nps.gov/api/v1/parks?parkCode=acad&api_key=SECRET_YOU_CAN_GET_ONE_AT https://www.nps.gov/subjects/developer/get-started.htm';
fetch(url)
.then(response => {
if (response.ok) return response.json();
})
.then(json => showResults(json))
.catch(err => { console.error(err); });
}
fetchPark();
</script>
</body>
</html>
输出是:
Acadia
描述:阿卡迪亚国家公园保护着美国大西洋沿岸最高岩石岬角的自然美景,丰富的生物多样性,清新的空气和水,以及丰富的文化遗产。每年有超过330万人探索1000英尺以上的七座山峰,158英里的远足径以及45英里的带有16座石桥的马车道路。
链接:https://www.nps.gov/acad/index.htm
地址:undefined
此外,请注意代理或防病毒等奇怪的东西阻碍。在没有获得预期响应时,应排除任何可以拦截HTTP流量的内容。