多个相同class的标签的鼠标移入移出事件

为多个具有相同class名字的标签绑定鼠标移入移出事件

案例：为多个class名字为aa的div绑定鼠标移入移出事件

要求：当鼠标移入到当前div时，当前div内的字体变成红色，移出时字体变成蓝色

实现步骤：

1.获取class为aa的所有div标签（改变div属性用）

var str = document.getElementsByClassName("aa");

2.根据类名利用each()方法为每一个标签绑定事件

①：移入事件

$(".aa").each(function(index){
         //移入事件
	$(this).mouseenter(function(obj) {
	//根据下标改变字体的颜色(红色)
        str[index].css("color", "red");
    });
});

②：移出事件

$(".aa").each(function(index){
         //移出
	$(this).mouseleave(function(obj) {
        //根据下标改变字体的颜色(蓝色)
        str[index].css("color", "blue");
    });
});

补充：在有多个div的情况下，根据下标对div进行显示和隐藏操作

/* mdiv：div的class名称   
   index:下标 */
$(".mdiv:eq("+index+")").show();
$(".mdiv:eq("+index+")").hide();