經常使用方法(算法)使用總結

時間 2019-11-08

標籤經常使用方法算法使用總結简体版

原文原文鏈接

經常使用方法(算法)使用總結

一,瀏覽器禁用常規方法

1,禁用右鍵

1 document.oncontextmenu = function(){
2     event.returnValue = false;
3 }
4 // 或者
5 document.oncontextmenu=new Function("event.returnValue=false"); 
6 // 或者直接返回整個事件
7 document.oncontextmenu = function(){
8     return false;
9 }

2,禁用網頁上選取內容

1 document.onselectstart = function(){
2     event.returnValue = false;
3 }
4 // 或者
5 document.onselectstart=new Function("event.returnValue=false");  
6 // 或者直接返回整個事件
7 document.onselectstart = function(){
8     return false;
9 }

3,禁用網頁上選取內容

1 document.oncopy = function(){
2     event.returnValue = false;
3 }
4 // 或者
5 document.oncopy =new Function("event.returnValue=false");  
6 // 或者直接返回整個事件
7 document.oncopy = function(){
8     return false;
9 }

同時也能夠直接加在body上

1  <body oncontextmenu = "return false" ></body>
2  <body onselectstart = "return false" ></body>
3  <body oncopy = "return false" ></body>
4  <!-- 方法一致 寫法不同 -->
5  <body oncontextmenu="event.returnValue=false" onselectstart="event.returnValue=false" oncopy="event.returnValue=false">

二,web端獲取客戶端IP

 1      getlocalIP = (callback) => {
 2         let PeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection
 3         let peer = new PeerConnection({
 4           iceServers: []
 5         })
 6         peer.createDataChannel('')
 7         peer.createOffer().then((offer) => {
 8           peer.setLocalDescription(offer)
 9         })
10         peer.onicecandidate = function (e) {
11           if (e.candidate) {
12             let reg = /([0-9]{1,3}(\.[0-9]{1,3}){3})/
13             e.candidate.candidate.split('\n').forEach((str) => {
14               str = reg.exec(str)
15               let IP = ''
16               if (str && str.length > 1) {
17                 IP = str[1]
18               }
19               if (callback && typeof callback == 'function') {
20                 callback(IP)
21               }
22             })
23           }
24         }
25       }
26 
27       // 獲取ip地址
28       getlocalIP(function (ip) {
29         if(ip){
30           alert('ip===' + ip)
31         }
32       })

三,橫向轉縱向排序算法

數組動態渲染默認是橫向渲染,若是想使用縱向渲染,則改變渲染數組的順序,則可實現界面縱向渲染的效果。web

第一步:根據渲染的列數,需將一維數組轉換爲二維數組算法

 1 //將一維數組 轉多維數組
 2             let len = baseArray.length;
 3             let n = Math.ceil(len / columnNumber); //每行顯示的個數
 4             let lineNum = len % n === 0 ? len / n : Math.floor((len / n) + 1);
 5             let tempArray = [];
 6             for (let i = 0; i < lineNum; i++) {
 7                 // slice() 方法返回一個從開始到結束（不包括結束）選擇的數組的一部分淺拷貝到一個新數組對象。且原始數組不會被修改。
 8                 let temp = baseArray.slice(i * n, i * n + n);
 9                 tempArray.push(JSON.parse(JSON.stringify(temp)));
10             }

第二步:實現二維數組橫縱列轉換數組

1 //實現二維數組橫縱列轉換
2             let newArray = tempArray[0].map(function (col, index) {
3                 return tempArray.map(function (row) {
4                     return row[index];
5                 })
6             });

第三步:將多維數組轉一維數組並去空瀏覽器

1 newArray = [].concat.apply([], newArray);//將多維數組 轉一維數組
2             let convertedArray = [];
3             //遍歷去掉空的數據
4             newArray.map(function (item) {
5                 if (item) {//保留對象數據
6                     convertedArray.push(item)
7                 }
8             });

第四步:完成代碼以下app

 1 function horizontalToVerticalSort(baseArray,columnNumber=3) {
 2             //將一維數組 轉多維數組
 3             let len = baseArray.length;
 4             let n = Math.ceil(len / columnNumber); //每行顯示的個數
 5             let lineNum = len % n === 0 ? len / n : Math.floor((len / n) + 1);
 6             let tempArray = [];
 7             for (let i = 0; i < lineNum; i++) {
 8                 // slice() 方法返回一個從開始到結束（不包括結束）選擇的數組的一部分淺拷貝到一個新數組對象。且原始數組不會被修改。
 9                 let temp = baseArray.slice(i * n, i * n + n);
10                 tempArray.push(JSON.parse(JSON.stringify(temp)));
11             }
12             //實現二維數組橫縱列轉換
13             let newArray = tempArray[0].map(function (col, index) {
14                 return tempArray.map(function (row) {
15                     return row[index];
16                 })
17             });
18             newArray = [].concat.apply([], newArray);//將多維數組 轉一維數組
19             let convertedArray = [];
20             //遍歷去掉空的數據
21             newArray.map(function (item) {
22                 if (item) {//保留對象數據
23                     convertedArray.push(item)
24                 }
25             });
26             return convertedArray;
27         }

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。