// 城市选择
// 实现思路
// 声明变量获取表格中的a标签以及城市选择标签,给表格标签添加active,
// 给城市加入鼠标点击事件,点击之后与city进行文字更换,同时给表格内的城市添加active类名,为避免之前的表格类名依然存在,需要先进行一次全部删除
window.onload = function(){
// 获取城市列表
var tds = document.querySelectorAll(".citylist table a"); // 改了这里
// 获取选定城市
var city = document.querySelector(".city-selected")
var hea = document.querySelector('.header-box-city > span');
var box = document.querySelectorAll('.citylist > div');
hea.onmouseover = function(){
for(let e = 0;e < box.length;e++){
box[e].classList.remove('Stealth');
}
}
// 给所有td单元格添加一个点击事件
for(let i = 0;i < tds.length;i++){
// 批量绑定点击事件
tds[i].onclick = function(){
// 验证是否有绑定点击事件成功
// console.log("我当前移入的是" + (i+1) + "城市")
// 将表格头部文字信息替换成当前点击的对象里的内容
city.innerHTML = this.innerHTML;
// 当前点击的对象添加一个active
for(let k = 0; k < tds.length;k++){
// 先将表格里所有的单元格移出active类名
tds[k].classList.remove('active')
}
console.log(this)
this.classList.add('active')
}
}
// var wdjd = document.querySelector(".header-box-loginlist > Stealth")
// var wdjda = document.querySelector(".dropdown > wdjdaa")
// wdjda.onmouseover = function(){
// wdjd.classList.remove('Stealth')
// }
}