You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
72 lines
2.8 KiB
72 lines
2.8 KiB
3 months ago
|
document.addEventListener("DOMContentLoaded", function () {
|
||
|
|
fetch("/api/heze")
|
||
|
|
.then(response => response.json())
|
||
|
|
.then(data => {
|
||
|
|
const about = document.getElementById("about");
|
||
|
|
about.textContent = data.data.about;
|
||
|
|
|
||
|
|
const placesContainer = document.getElementById("places-container");
|
||
|
|
const foodContainer = document.getElementById("food-container");
|
||
|
|
const cultureContainer = document.getElementById("culture-container");
|
||
|
|
|
||
|
|
// 渲染景点
|
||
|
|
data.data.places.forEach(place => {
|
||
|
|
const placeItem = document.createElement("div");
|
||
|
|
placeItem.classList.add("item");
|
||
|
|
|
||
|
|
const placeName = document.createElement("div");
|
||
|
|
placeName.classList.add("item-name");
|
||
|
|
placeName.textContent = place.name;
|
||
|
|
|
||
|
|
const placeDescription = document.createElement("div");
|
||
|
|
placeDescription.classList.add("item-description");
|
||
|
|
placeDescription.textContent = place.description;
|
||
|
|
|
||
|
|
placeItem.appendChild(placeName);
|
||
|
|
placeItem.appendChild(placeDescription);
|
||
|
|
|
||
|
|
placesContainer.appendChild(placeItem);
|
||
|
|
});
|
||
|
|
|
||
|
|
// 渲染美食
|
||
|
|
data.data.food.forEach(food => {
|
||
|
|
const foodItem = document.createElement("div");
|
||
|
|
foodItem.classList.add("item");
|
||
|
|
|
||
|
|
const foodName = document.createElement("div");
|
||
|
|
foodName.classList.add("item-name");
|
||
|
|
foodName.textContent = food.name;
|
||
|
|
|
||
|
|
const foodDescription = document.createElement("div");
|
||
|
|
foodDescription.classList.add("item-description");
|
||
|
|
foodDescription.textContent = food.description;
|
||
|
|
|
||
|
|
foodItem.appendChild(foodName);
|
||
|
|
foodItem.appendChild(foodDescription);
|
||
|
|
|
||
|
|
foodContainer.appendChild(foodItem);
|
||
|
|
});
|
||
|
|
|
||
|
|
// 渲染文化
|
||
|
|
data.data.culture.forEach(culture => {
|
||
|
|
const cultureItem = document.createElement("div");
|
||
|
|
cultureItem.classList.add("item");
|
||
|
|
|
||
|
|
const cultureName = document.createElement("div");
|
||
|
|
cultureName.classList.add("item-name");
|
||
|
|
cultureName.textContent = culture.name;
|
||
|
|
|
||
|
|
const cultureDescription = document.createElement("div");
|
||
|
|
cultureDescription.classList.add("item-description");
|
||
|
|
cultureDescription.textContent = culture.description;
|
||
|
|
|
||
|
|
cultureItem.appendChild(cultureName);
|
||
|
|
cultureItem.appendChild(cultureDescription);
|
||
|
|
|
||
|
|
cultureContainer.appendChild(cultureItem);
|
||
|
|
});
|
||
|
|
})
|
||
|
|
.catch(error => {
|
||
|
|
console.error("Error fetching data:", error);
|
||
|
|
});
|
||
|
|
});
|