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.
69 lines
2.7 KiB
69 lines
2.7 KiB
1 month ago
|
document.addEventListener("DOMContentLoaded", function () {
|
||
|
|
fetch("/api/travel-guide")
|
||
|
|
.then(response => response.json())
|
||
|
|
.then(data => {
|
||
|
|
const placesContainer = document.getElementById("places-container");
|
||
|
|
const foodContainer = document.getElementById("food-container");
|
||
|
|
const itineraryContainer = document.getElementById("itinerary-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.itinerary.forEach(itinerary => {
|
||
|
|
const itineraryItem = document.createElement("div");
|
||
|
|
itineraryItem.classList.add("item");
|
||
|
|
|
||
|
|
const day = document.createElement("div");
|
||
|
|
day.classList.add("item-name");
|
||
|
|
day.textContent = itinerary.day;
|
||
|
|
|
||
|
|
const activities = document.createElement("div");
|
||
|
|
activities.classList.add("item-description");
|
||
|
|
activities.textContent = itinerary.activities.join(", ");
|
||
|
|
|
||
|
|
itineraryItem.appendChild(day);
|
||
|
|
itineraryItem.appendChild(activities);
|
||
|
|
|
||
|
|
itineraryContainer.appendChild(itineraryItem);
|
||
|
|
});
|
||
|
|
})
|
||
|
|
.catch(error => {
|
||
|
|
console.error("Error fetching travel guide data:", error);
|
||
|
|
});
|
||
|
|
});
|