首先引用 <script src="./js/jquery-3.3.1.min.js"></script>     <script src="./js/xxx.js"></script> 轮播图 $(function(){     var current=0;     var count=$(".pics-list>li").length;     //移动的方法     function move(){ //执行方法          $(".points-list>li").eq(current).addClass("active").siblings().removeClass("active");         $(".pics-list").css("left",-1200*current+"px");     }      //点击右箭头时起作用     function next(){         if(current<count-1){             current++;         }else{             current=0;         }           move();     }          //鼠标移入移出时 定时器显示  移入 起作用 移出 不起作用(不需要定时器)       var timer=setInterval(() => {            next();         }, 3000);              鼠标悬浮hover时方法   鼠标放上去自动轮播时间停止 
             $(".banner-box ").hover(function(){                clearInterval(timer);              },function(){                 timer=setInterval(() => {                     next();                  }, 3000);              })                   //点击点的方法   点击点时 自动轮播到图片     $(".points-list>li").click(function(){         current=$(this).index();         move();     })     $(".buts>.next").click(function(){          next();     })   //点击左箭头时起作用     $(".buts>.prev").click(function(){         if(current>0){             current--;         }else{             current=count-1;         }         move();     }) }) $(function(){     $(".top-list .title").click(function(){         $(this).addClass("active").siblings().removeClass("active");         $(".top-list-main ul").eq((this).index()).show().siblings().hide();     }) }) 设置时间

• setInterval() - 间隔指定的毫秒数不停地执行指定的代码。
• setTimeout() - 在指定的毫秒数后执行指定代码。

• clearInterval() 方法用于停止 setInterval() 方法执行的函数代码。

语法：window.clearInterval(intervalVariable)

  $(function(){     $(".load-more").click(function(){         // var $list=$(this).closest(".filter-list");         // var height=$list.css("height");         // if(height==="30px"){         //     $("this").addClass("active");         //     $list.css({"overflow":"auto","height":"auto"});         // }else{         //     $("this").removeClass("active");         //     $list.css({"overflow":"hideen","height":"30px"});         // }                 //closest方法获得匹配选择器的第一个祖先元素，找父节点 如果不是  i一直找         if($(this).hasClass("active")){             $(this).removeClass("active").closest(".filter-list").css({"overflow":"hidden","height":"30px"});         }else{             $(this).addClass("active").closest(".filter-list").css({"overflow":"auto","height":"auto"});         }     }) })  

• closest() 方法返回被选元素的第一个祖先元素。
• 祖先是父、祖父、曾祖父，依此类推。

鼠标悬浮图片显示小黑框 右边显示图片精确图片 $(function(){ //图片悬浮效果     $(".small_box").hover(function(){         $(this).find(".float_layer").show();         $(".big_box").show();     },function(){         $(this).find(".float_layer").hide();         $(".big_box").hide();     })     $(".small_box").mousemove(function(e){         // console.log(e);         //鼠标位置         var x=e.offsetX,y=e.offsetY;         //小黑框的左上角位置 -100 让鼠标永远在小黑框的中间            var left=x-100,top=y-100;            if(left<0){             left=0;            }            if(top<0){             top=0;            }            if(left>200){                left=200;            }            if(top>200){             top=200;         }            $(this).find(".float_layer").css({                top:top+"px",                left:left+"px"             }); //大图片是800px是显示图片的两倍所以要*2 显示精确图时是大图片反方向所以是（-2）*top/left             $(".big_box img").css({                top:-2*top+"px",                left:-2*left+"px"             })     }) })
 

find() 方法返回被选元素的后代元素。

后代是子、孙、曾孙，依此类推。