从 JavaScript 中的 json 文件中检索 url
retrieving a url from a json file in JavaScript
我有一个 JSON 文件,其中包含我当前的 XMLHttpRequest 检索的 URL,但是当我单击 link 时,我得到“无法获取 /url ”。 JSON 包含这样的公司信息:
{
"company": "Nike",
"webAddress": "https://www.nike.com/",
"accessories": "Yes",
"component": "No",
"clothing": "Yes",
"holiday": "No",
"insurance": "No",
"nutrition": "No",
"association": "No",
"location": "USA"
}
我这样检索 JSON 文件:
function loadAllBrands(e) {
const xhr = new XMLHttpRequest();
xhr.open('GET', 'brands.json', true);
xhr.onload = function() {
if(this.status === 200) {
// console.log(this.responseText);
const customers = JSON.parse(this.responseText);
let output = '';
customers.forEach(function(item) {
output += `
<div class="w3-card-4 w3-white w3-large card-margin">
<ul>
<h2 class="card-title">${item.company}</h2>
<li><a href="url" class="w3-text-blue">${item.webAddress}</a></li>
<li>Location: ${item.location}</li>
<li>Accessories: ${item.accessories}</li>
<li>Components: ${item.component}</li>
<li>Clothing: ${item.clothing}</li>
<li>Holidays: ${item.holiday}</li>
<li>Insurance: ${item.insurance}</li>
<li>Nutrition: ${item.nutrition}</li>
<li>Association: ${item.association}</li>
</ul>
</div>
`;
})
document.getElementById('output').innerHTML = output;
}
}
xhr.send();
};
如何制作可点击的 link 将用户带到网址?
就像邪猴说的,将这一行中的“url”替换为“${item.webAddress}”:
<li><a href="url" class="w3-text-blue">${item.webAddress}</a></li>
我有一个 JSON 文件,其中包含我当前的 XMLHttpRequest 检索的 URL,但是当我单击 link 时,我得到“无法获取 /url ”。 JSON 包含这样的公司信息:
{
"company": "Nike",
"webAddress": "https://www.nike.com/",
"accessories": "Yes",
"component": "No",
"clothing": "Yes",
"holiday": "No",
"insurance": "No",
"nutrition": "No",
"association": "No",
"location": "USA"
}
我这样检索 JSON 文件:
function loadAllBrands(e) {
const xhr = new XMLHttpRequest();
xhr.open('GET', 'brands.json', true);
xhr.onload = function() {
if(this.status === 200) {
// console.log(this.responseText);
const customers = JSON.parse(this.responseText);
let output = '';
customers.forEach(function(item) {
output += `
<div class="w3-card-4 w3-white w3-large card-margin">
<ul>
<h2 class="card-title">${item.company}</h2>
<li><a href="url" class="w3-text-blue">${item.webAddress}</a></li>
<li>Location: ${item.location}</li>
<li>Accessories: ${item.accessories}</li>
<li>Components: ${item.component}</li>
<li>Clothing: ${item.clothing}</li>
<li>Holidays: ${item.holiday}</li>
<li>Insurance: ${item.insurance}</li>
<li>Nutrition: ${item.nutrition}</li>
<li>Association: ${item.association}</li>
</ul>
</div>
`;
})
document.getElementById('output').innerHTML = output;
}
}
xhr.send();
};
如何制作可点击的 link 将用户带到网址?
就像邪猴说的,将这一行中的“url”替换为“${item.webAddress}”:
<li><a href="url" class="w3-text-blue">${item.webAddress}</a></li>