整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
、事件流
事件是js与HTML交互的基础，事件流描述的是页面接受事件的顺序，而事件流又分为三个阶段：捕获阶段、目标阶段和冒泡阶段。
如果单纯的事件处理，事件捕获和事件冒泡二选一即可，导致两者并存的原因是当年微软和网景的浏览器大战，微软提出了事件冒泡，而网景提出了事件捕获。
1、事件冒泡
事件开始由最深层的元素接收，然后逐级向上传播
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#div {
width: 100px;
height: 100px;
background-color: red;
}
</style>
</head>
<body>
<div id="div"></div>
<script>
let div=document.getElementById('div');
div.onclick=function () {
console.log('div');
};
document.body.onclick=function () {
console.log('body')
};
</script>
</body>
</html>
当点击div标签的时候，先打印出div，然后再打印出body。因为div先接收到点击事件，然后再向它的父元素body传播，再到html，最后到document。
IE，chrome，Firefox，Opera，Safari五大浏览器都支持事件冒泡。
2、事件捕获
事件开始由最外层的document捕获，然后依次向内传播，直至最深层的元素
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#div {
width: 100px;
height: 100px;
background-color: red;
}
</style>
</head>
<body>
<div id="div"></div>
<script>
let div=document.getElementById('div');
div.addEventListener('click', function () {
console.log('div');
}, true);
document.body.addEventListener('click', function () {
console.log('body')
}, true);
</script>
</body>
</html>
当点击div标签的时候，最先打印body，然后再打印出div。因为addEventListener函数的第三个参数为true时，函数处理捕获事件，document先捕获点击事件，依次传播到html—body—div。
IE9，chrome，Firefox，Opera，Safari五大浏览器都支持事件捕获，IE8及以下版本不支持事件捕获。
以下是总结出来最全前端框架视频，包含： javascript/vue/react/angualrde/express/koa/webpack 等学习资料。
var arr=[6,5,4,3,2,1];实现从小到大排序
冒泡排序：数组内前后两两比较，如果前者大于后者，则交换两者位置，直到所有的元素都按照从小到大排列，结束排序。
原理：两两比较，始终将较大的数放在后面
var arr=[6,5,4,3,2,1];
//执行arr.length-1次循环，因为每次循环都会固定一位最大的数放在最后位置，当第五次循环时，结果会将最大的数放在arr[1],排序结束
for(var i=0;i<arr.length-1;i++){
//决定每轮元素比较多少次，当每次轮结束时，会将最大的数放在最后，下一轮比较时，最后固定的较大的数可以不再比较，所以j<arr.length-1-i.
for(var j=0;j<arr.length-1-i;j++){
//每次比较时，如果前者大于后者，则调换二者位置
if(arr[j]>arr[j+1]){
//两个元素互换值，应该定义第三变量，下方赋值原理为：arr[j+1]--->temp;arr[j]--->arr[j+1];temp--->arr[j]
var temp=arr[j+1];
arr[j+1]=arr[j];
arr[j]=temp;
}
}
}第1次比较：5 6 4 3 2 1
第2次比较：5 4 6 3 2 1
第3次比较：5 4 3 6 2 1
第4次比较：5 4 3 2 6 1
第5次比较：5 4 3 2 1 6
第1次比较：4 5 3 2 1
第2次比较：4 3 5 2 1
第3次比较：4 3 2 5 1
第3次比较：4 3 2 1 5
第1次比较：3 4 2 1
第2次比较：3 2 4 1
第3次比较：3 2 1 4
第1次比较：2 3 1
第2次比较：2 1 3
第1次比较： 1 2
、 冒泡排序概述
冒泡排序是通过遍历待排序的数列，一次比较两个元素，根据大小调换位置，直到把最大的或最小的冒出来的排序方式。
冒泡排序平均时间复杂度是：O(n^2)
步骤是：
1、 先建立两个循环，外循环用于遍历整个数组，内循环遍历待排序的区间。
2、 内循环每次都从第一项开始，将该项与后项进行比较，再两两交换，一直到待排序结尾。
3、 重复第二项，一直到数组遍历完。
二、 冒泡排序执行过程分析
数列：
1) 1, 3, 4, 2, 5
1,4,3,5,2=> 1,3,4,5,2=> 1,3,4,5,2=> 1,3,4,2,5
2) 1, 3, 2, 4, 5
1,3,4,2,5=> 1,3,4,2,5=> 1,3,2,4,5
3) 1, 2, 3, 4, 5
1,3,2,4,5=> 1,2,3,4,5
4) 1, 2, 3, 4, 5
1,2,3,4,5
一、 冒泡排序实现
1. 自左往右逐个将最大项冒出
自左往右逐个将最大项冒出
2. 自右往左逐个将最小项冒出
四、 冒泡排序的优化
*请认真填写需求信息，我们会在24小时内与您取得联系。
