js each函数 的使用

使用场景1. $().each()

当存在多个相同的class元素，元素是不固定的，并且要给他们增加点击事件

$(".tip").each(function (index) {
                    $(this).on("click", function () {                   
                       //循环给每个元素增加背景颜色
                        $(".tip").each(function () {    
                            $(this).css("background-color", "transparent");
                        });
                        $(this).css("background-color", "#1E90FF");    
                        var lc_name = $(this).attr("name");
                        var lon = $(this).attr("lon");
                        var lat = $(this).attr("lat");
                        var azimuth = $(this).attr("azimuth");
                        var bandclass = $(this).attr("bandclass");
           locateSector(lon,lat,covercharacter,azimuth,bandclass);
                    });
                });

使用场景2. $.each

第一个参数为dom元素对象

$.each($('.country_info'),function(index,item){
                switch(index){
                    case 0:
                    /*根据选择的指标去展示对应的指标*/
                    var goalObj = $('#shwo_goal');
                    goalObj.text(data[0].paixuType);
                    $(item).text(data[0].SORT);
                    break;
                }
            });

第一个参数为data数组

$.each(data, function (index, item) {
                if (index == 0)
                return true;
                str += '<div class="province_china label fl province_flag" style="color:#fff;cursor: default;">\
                <div class="icon_location deleteAllowed'+ (index==1?' circle':(index==2?' circle':(index==3?' circle':''))) +'">\
                <img  alt="省图标" style="display: none;position: absolute;top: 0.625rem;" class="yellow_icon">\
                <span class="topthree'+ (index==1?' colorquan':(index==2?' colorquan':(index==3?' colorquan':''))) +'" style="position: absolute;top: -3px;left: 7px;" class="white_icon icon_color">' + index + '</span>\
                </div>\
                <ul style="width: 12.5rem;position: absolute;left: 4.6rem;" data-type="province" class="list_item" data-name="' + item.province + '">\
                <li>\
                <a href="javascript:void(0)" class="item_color"><span>'+ item.province +'</span><span class="fr">'+ item.SORT +'</span></a>\
                </li>\
                </ul>\
                </div>'
        });