整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
、事件流
事件是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小時內與您取得聯系。
