链式编程，隐式迭代

链式编程原理：return this

但有时候获取操作的时候，会返回获取到相应的值，无法返回this

比如 链式的多了，就不知道返回谁，如果像返回之前this 就用 end()

 $(".comment li").on("mouseente",function(){
                $(this).text(wjx_sel).prevAll().text().nextAll().text()
            })

end() 结束当前链最近的一次过滤操作，并且返回匹配之前的状态 this

隐式迭代原来

隐式迭代的意思是：在方法的内部会为匹配到的所有元素进行循环遍历，执行相应的方法；而不用我们再进行循环，简化我们的操作，方便我们调用。

如果获取的是多元素的值，大部分情况下返回的是第一个元素的值。

 

案例淘宝评论五角星

 $(function(){
            var wjx_none = '☆'; // 空心五角星
            var wjx_sel = '★'; // 实心五角星
            //需求1：鼠标移上当前五角星和他之前的额五角星都变成实心，后面的是空心
            //需求2：鼠标点击当前五角星和他之前的额五角星都变成实心，后面的是空心
            //鼠标移上事件
            $(".comment li").on("mouseenter",function(){
                $(this).text(wjx_sel).prevAll().text(wjx_sel).end().nextAll().text(wjx_none)
            });
            //鼠标离开
            $(".comment li").on("mouseleave",function(){
                //bug：如果没有点击过li，那么会出现无法清除的现象，处理办法就是先判断，看看是否有current类
                if($("li.current").length >0){
                //当鼠标移开的时候，谁有current类名，那么当前和之前所有的li前部是实心五角星，后面的所有li都是空心
                    $("li.current").text(wjx_sel).prevAll().text(wjx_sel).end().nextAll().text(wjx_none)
                }else{
                    $(".comment li").text(wjx_none)
                }
            });
            //鼠标点击
            
            $(".comment li").on("click",function(){
                //点击哪个li给他加一个类名。清空其他所有的li的类名
                $(this).attr("class","current").siblings().removeClass()
            });
        })
    </script>

 

each 方法

遍历jq对象集合，为每个元素执行一个函数

$(" 获取元素").each( fucntion( 参数1(index 当前元素索引值) ，参数2（当前元素element ）){ 执行函数})

tagName：获得元素的标签名：

$("ul li").each(function(index,element){
    console.log(index +"^^^^^"+ element.tagName)//当前对象 
)

 

转载于:https://www.cnblogs.com/wdz1/p/8076157.html