javascript疑难问题---11、回调函数
一、总结
一句话总结:
回调函数是你定义了的,但是你没有直接调用,但是 最终它执行了(在特定条件或时刻)的函数
1、常见的回调函数有哪些?
比如DOM事件函数、定时器函数、ajax回调函数等等
二、回调函数
博客对应课程的视频位置:11、回调函数
https://www.fanrenyi.com/video/4/176
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>回调函数</title> 6 </head> 7 <body> 8 <!-- 9 1. 什么函数才是回调函数? 10 * 你定义的 11 * 你没有直接调用 12 * 但最终它执行了(在特定条件或时刻) 13 2. 常见的回调函数? 14 * DOM事件函数 15 * 定时器函数 16 * ajax回调函数 17 等等 18 --> 19 20 21 <!--1、 DOM事件函数--> 22 <!--<button id="btn">btn1</button>--> 23 <!--<script>--> 24 <!-- var btn = document.getElementById('btn')--> 25 <!-- btn.onclick = function () {--> 26 <!-- alert(this.innerHTML)--> 27 <!-- };--> 28 29 <!-- // (function () {--> 30 <!-- // alert('this.innerHTML')--> 31 <!-- // })();--> 32 <!--</script>--> 33 34 <!--2、jquery事件--> 35 <!--<button id="btn2">btn2</button>--> 36 <!--<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>--> 37 <!--<script>--> 38 <!-- //注意到click方法中是一个函数而不是一个变量--> 39 <!-- //它就是回调函数--> 40 <!-- $("#btn2").click(function() {--> 41 <!-- alert("Btn2 Clicked");--> 42 <!-- });--> 43 <!--</script>--> 44 45 <!--3、arr.forEach--> 46 <!--<script>--> 47 <!-- var arr = ["孙悟空","猪八戒","沙和尚","唐僧","白骨精"];--> 48 <!-- arr.forEach(function(value , index , arr){--> 49 <!-- console.log(index+' . '+value);--> 50 <!-- //console.log('回调函数被执行了');--> 51 <!-- });--> 52 <!--</script>--> 53 54 <!--4、定时器函数--> 55 <!--<script>--> 56 <!-- setInterval(function () {--> 57 <!-- console.log('到点啦!')--> 58 <!-- }, 2000);--> 59 <!--</script>--> 60 61 <!--5、ajax函数--> 62 <!--<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>--> 63 <!--<script>--> 64 <!-- $.ajax({--> 65 <!-- url: "test.html",--> 66 <!-- context: document.body,--> 67 <!-- success: function(){--> 68 <!-- alert('调用成功');--> 69 <!-- },--> 70 <!-- error:function () {--> 71 <!-- alert('调用失败');--> 72 <!-- }--> 73 <!-- });--> 74 <!--</script>--> 75 76 <!--6、排序函数--> 77 <!--<script>--> 78 <!-- arr = [5,4,2,11,3,6,8,7];--> 79 <!-- //arr.sort();--> 80 <!-- //--> 81 <!-- arr.sort(function(a,b){--> 82 <!-- //升序排列--> 83 <!-- return a - b;--> 84 85 <!-- //降序排列--> 86 <!-- //return b - a;--> 87 <!-- });--> 88 <!-- console.log(arr);--> 89 <!--</script>--> 90 91 </body> 92 </html>