1：网站首页的导航文字 鼠标放上去 变颜色跟字体大小。如果用id这种触发方法 就需要每一个 导航文字前面都加<a id='test'> 这样太麻烦，最好的办法就是用class 实现，因为id必须是唯一的
导航文字外面包一层div ，命名：BaseBox 这里是随便命名的，
如图1：
那么如何在选择哪个导航文字时就触发哪个文字呢？用this ，this表示当前鼠标接触的。
下面的方法第一个function 代表 鼠标触发到文字时，第二个function 代表鼠标离开后
$(".BaseBox a").hover(
function () {
$(this).css({ color: "#333333", fontWeight: "bold" })
},
function () {
$(this).css({ color: "#666666", fontWeight: "" })
})
2：通过js修改图片地址，或者是文字
这里需要注意的是如何定位到 元素：用 document.getElementById("img") 定位id，img是id，修改该id的src地址，
或者是修改里面H1的文字。如果是修改文字内容就是用 innerHTML
BrandImgs[i].onmouseover = function () {
this.getElementsByClassName("BrandPic1")[0].style.display = "none";
this.getElementsByClassName("BrandPic2")[0].style.display = "";
document.getElementById("img").src = "../../../Images/Home/Index/New/Brand/" + imgList[this.getElementsByClassName("BrandPic2")[0].id] + ".png";
document.getElementById("titleid").innerHTML = titleList[this.getElementsByClassName("BrandPic2")[0].id-1];
document.getElementById("brandcontent").getElementsByTagName("li")[2].innerHTML = brandList[this.getElementsByClassName("BrandPic2")[0].id-1];
}
3：在Html里面需要循环遍历某个数组内容，
优点：节省代码 维护灵活，降低维护成本 代码优雅