fadeToggle([speed],[easing],[fn])
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="http://www.likecs.com/js/jquery-3.3.1.min.js"></script> <script> //隐藏div function hideFn(){ //默认方式 //$("#showDiv").hide("slow","swing") //滑动方式 //$("#showDiv").slideUp("slow","swing") //淡入淡出方式 $("#showDiv").fadeOut("8000","swing") } //点击按钮显示div function showFn(){ //默认方式 //$("#showDiv").show("slow","linear"); //滑动方式 //$("#showDiv").slideDown("slow","linear"); //淡入淡出方式 $("#showDiv").fadeIn("5000","linear"); } //点击按钮切换div显示和隐藏 function toggleFn(){ //默认方式 //$("#showDiv").toggle("slow","swing"); //滑动方式 //$("#showDiv").slideToggle("slow","swing"); //淡入淡出方式 $("#showDiv").fadeToggle("5000","swing"); } </script> </head> <body> <input type="button" value="点击按钮隐藏div"> <input type="button" value="点击按钮显示div"> <input type="button" value="点击按钮切换div显示和隐藏"> <div> div显示和隐藏 </div> </body> </html> 遍历js遍历方式 for(初始化值;循环结束条件；步长)
jq遍历方式
1.jq对象.each(callback)
2.$.each(object,[callback])
3.for...of;
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="http://www.likecs.com/js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> $(function () { //获取遍历对象 var citys = $("#city li"); //第一种方式，不能获得索引 citys.each(function (index,element) { // alert(this.innerHTML) // }); //第二种方式，可以获得索引，在回调函数中定义参数 if("上海"==$(element).html()){ return false;//false相当于java的break,true相当于continue } alert(index+":"+$(element).html());//把获得的js对象强制转换jq对象 }); }); </script> </head> <body> <ul> <li>北京</li> <li>上海</li> <li>天津</li> <li>重庆</li> </ul> </body> </html> 事件绑定1.jquery标准的绑定方式：jq对象.事件方法(回调函数)
2.on绑定事件/off解除绑定
jq对象.on("事件名称"，回调函数)
jq对象.off("事件名称")
3.事件切换：toggle
jq对象.toggle(fn1,fn2....)
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="http://www.likecs.com/js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> $(function () { //绑定单机事件 $("#btn").on("click",function () { alert("我被点击了") }) //解除单机事件 $("#btn2").click(function () { $("#btn").off("click");//若不传递click参数，则将btn上的所有绑定事件解绑 }) }); </script> </head> <body> <input type="button" value="使用on绑定点击事件"> <input type="button" value="使用off解绑点击事件"> </body> </html> 案例1当页面加载完，3秒后，自动显示广告