javascript
// script.js// 获取用户输入的地铁站名称
const metroStation = document.getElementById('metro-station');// 处理表单提交事件
document.addEventListener('submit', (e) => {e.preventDefault();// 清除之前的搜索结果const results = document.getElementById('results');while (results.firstChild) {results.removeChild(results.firstChild);}// 检查用户输入是否为空if (!metroStation.value) {alert('请输入地铁站的名称');return;}// 根据用户输入查找驾校findDrivingSchools(metroStation.value).then((schools) => {// 将搜索结果显示到页面上displayResults(schools);});
});// 查找驾校的函数
function findDrivingSchools(metroStationName) {// 模拟驾校数据const drivingSchools = [{name: '驾校 1',address: '地址 1',distanceFromMetro: 0.5 // 以千米为单位},{name: '驾校 2',address: '地址 2',distanceFromMetro: 1.2},{name: '驾校 3',address: '地址 3',
distanceFromMetro: 1.8}];// 过滤出满足条件的驾校const filteredSchools = drivingSchools.filter((school) => {return school.distanceFromMetro <= 1; // 搜索范围内为 1 公里以内});// 返回满足条件的驾校数组return Promise.resolve(filteredSchools);
}// 将搜索结果显示到页面的函数
function displayResults(schools) {const results = document.getElementById('results');// 创建一个标题元素const title = document.createElement('h2');title.innerText = '搜索结果:';results.appendChild(title);// 遍历驾校数组并创建列表元素schools.forEach((school) => {const listItem = document.createElement('li');// 设置列表元素的文本内容const text = `${school.name} - ${school.address} - 距离地铁站:${school.distanceFromMetro} 千米`;listItem.innerText = text;// 将列表元素添加到搜索结果中results.appendChild(listItem);});
}