記錄錯誤日志
window.onerror = function(message, url, lineNumber,columnNo,error) { var data = { "message":message, "url":url, "error":error.stack }; $.ajax({ url:"/error/capture", type:"post", data:data, success:function(){ } }); return true; };javascript隨機數生成算法
function rnd( seed ){ seed = ( seed * 9301 + 49297 ) % 233280; //為何使用這三個數? return seed / ( 233280.0 ); }; function rand(number){ today = new Date(); seed = today.getTime(); return Math.ceil( rnd( seed ) * number ); }; myNum=(rand(5)); var rand = (function(){ var seed = (new Date()).getTime() function r(){ seed = (seed*9301+49297)%233280 return seed/(233280.0) } return function(number){ return Math.ceil(r()*number) } })() rand = (function(){ var today = new Date(); var seed = today.getTime(); function rnd(){ seed = ( seed * 9301 + 49297 ) % 233280; return seed / ( 233280.0 ); }; return function rand(number){ // return Math.ceil(rnd(seed) * number); return Math.ceil(rnd() * number); }; })(); myNum = (rand(5));JavaScript 中,如何求出兩個數組的交集和差集
_.intersection([1, 2, 3], [101, 2, 1, 10], [2, 1]); => [1, 2] _.difference([1, 2, 3, 4, 5], [5, 2, 10]); => [1, 3, 4] let a = new Set([1, 2, 3]); let b = new Set([3, 5, 2]); // 并集 let unionSet = new Set([...a, ...b]); //[1,2,3,5] // 交集 let intersectionSet = new Set([...a].filter(x => b.has(x))); // [2,3] // ab差集 let differenceABSet = new Set([...a].filter(x => !b.has(x))); // [1] 再把Set轉換為數組即可. let arr = Array.from(set); // 或 let arr = [...set]; 相同的 a.filter(function(v){ return b.indexOf(v) > -1 }) 不同的 a.filter(function(v){ return !(b.indexOf(v) > -1) }).concat(b.filter(function(v){ return !(a.indexOf(v) > -1)}))獲取某個DOM元素綁定的事件
getEventListeners($("selector")) 方法以數組對象的格式返回某個元素綁定的所有事件 getEventListeners($("#firstName")).click[0].listener 會返回ID為 firstName 元素綁定的click事件 inspect($("selector")) 會檢查所有匹配選擇器的DOM元素,并返回所有選擇器選擇的DOM對象。例如inspect($("#firstName")) 選擇所有ID是 firstName 的元素,inspect($("a")[3]) 檢查并返回頁面上第四個 p元素。 $0, $1, $2等等會返回你最近檢查過的幾個元素,例如 $0 會返回你最后檢查的元素,$1 則返回倒數第二個img onerror事件觸發
$("img").each(function() { if (!this.complete || typeof this.naturalWidth == "undefined" || this.naturalWidth == 0) { this.src = "default.png"; } });禁止瀏覽器記住密碼
在input[type=’password’]的前面加上一個隱藏的密碼框即可,且要求是:不能添加id和name屬性
var $body = $("body"); document.title = ‘title’ // hack在微信等webview中無法修改document.title的情況 var $iframe = $("").on("load", function() { setTimeout(function() { $iframe.off("load").remove() }, 0) }).appendTo($body)圖片的預加載
function imgLoad(src){ var img = new Image(); if(img.complete){ //從緩存里面取 callback(); }else{ img.onload = function(){ //實際加載完成 callback(); } } img.src = src; }實現類似于add(1)(2)(3)調用
function add(x){ var sum = x; var tmp = function(y){ sum = sum + y; return tmp; } tmp.toString = function(){ return sum; } return tmp }用代碼來畫個國旗
js獲取URL中的參數
function getQueryString(url, name) { var reg = new RegExp("(^|&|?)" + name + "=([^&]*)(&|$)", "i"); var r = url.substr(1).match(reg); if (r != null) return unescape(r[2]); return null; }視頻video標簽在移動端的播放總結
function video_loading( $video ){ $(".video_loading").show(); var timer = setInterval(function(){ var currentTime = $video[0].currentTime; // 檢測當前的播放時間 if( currentTime>0 ){ $(".video_loading").hide(); clearInterval( timer ); } }, 100) } /** 視頻的播放時間改變時進行的操作 videoid video標簽的id cur 當前播放時間,可以傳入ended參數 func 回調函數 */ videoUpdate : function(videoid, cur, func){ var myVideo = document.getElementById(videoid); if( myVideo ){ if( typeof cur =="number" ){ myVideo.addEventListener("timeupdate", function(){ if( this.currentTime>=cur ){ func(); myVideo.removeEventListener("timeupdate", function(){ }, false); } }, false); }else{ myVideo.addEventListener(cur, function(){ func(); }, false); } } } // 第一屏的視頻進行到4秒時,顯示透明圖層以提供用戶操作 tool.videoUpdate( "video1", 4, function(){ $(".s1 .overlay").show(); }); // 第一屏的視頻結束時,顯示向下滑動提示按鈕 tool.videoUpdate( "video1", "ended", function(){ $(".s1 .tip").show(); });為博客的文章添加二維碼
$(".bcontent").append(""); $(".bcontent").on("click", ".qrcode a", function(){ var $tsp = $(this).next(); if( $tsp.find("canvas").length ){ if( $tsp.css("display")=="block" ){ $tsp.hide(); }else{ $tsp.show(); } }else{ if( self.showing ){ return; } self.showing = true; $tsp.show().html( "正在生成中..." ); $.ajax({ url : "jquery.qrcode.min.js", dataType : "script", type : "get" }).done(function(){ self.showing = false; $tsp.html(""); $tsp.qrcode({ render : "canvas", width : 176, height: 176, text : window.location.href }); }) } })使用DOM中的a標簽解析url
// 創建一個額外的a標簽 function parseURL(url) { var a = document.createElement("a"); a.href = url; return { source: url, protocol: a.protocol.replace(":",""), host: a.hostname, port: a.port, query: a.search, params: (function(){ var ret = {}, seg = a.search.replace(/^?/,"").split("&"), len = seg.length, i = 0, s; for (;ijavascript如何添加前置0 function addPreZero(num){ return ("000000000"+num).slice(-10); }html5實現圖片預覽和查看原圖var upimg = document.querySelector("#upimg"); upimg.addEventListener("change", function(e){ var files = this.files; if(files.length){ // 對文件進行處理,下面會講解checkFile()會做什么 checkFile(this.files); } }); // 圖片處理 function checkFile(files){ var file = files[0]; var reader = new FileReader(); // show表示,用來展示圖片預覽的 if(!/image/w+/.test(file.type)){ show.innerHTML = "請確保文件為圖像類型"; return false; } // onload是異步操作 reader.onload = function(e){ show.innerHTML = ""; } }判斷 x 是否是整數function isInteger(x) { return parseInt(x, 10) === x; } function add(x, y) { return x.toPrecision() + y.toPrecision() } console.log(add(0.1,0.2)); function add(num1, num2){ let r1, r2, m; r1 = (""+num1).split(".")[1].length; r2 = (""+num2).split(".")[1].length; m = Math.pow(10,Math.max(r1,r2)); return (num1 * m + num2 * m) / m; } console.log(add(0.1,0.2)); //0.3 console.log(add(0.15,0.2256)); //0.3756PhantomJS抓取網頁并將它渲染成圖片var page = require("webpage").create(); page.settings.userAgent = "WebKit/534.46 Mobile/9A405 Safari/7534.48.3"; page.settings.viewportSize = { width: 400, height: 600 }; page.open("http://m.bbc.co.uk/news/business", function (status) { if (status !== "success") { console.log("Unable to load BBC!"); phantom.exit(); } else { window.setTimeout(function () { page.clipRect = { left: 0, top: 0, width: 400, height: 600 }; page.render("bbc-page1.png"); page.clipRect = { left: 0, top: 600, width: 400, height: 600 }; page.render("bbc-page2.png"); phantom.exit(); }, 2000); } });復制與粘貼倒計時的JSEmail me at matt@example.co.uk
var copyEmailBtn = document.querySelector(".js-emailcopybtn"); copyEmailBtn.addEventListener("click", function(event) { // Select the email link anchor text var emailLink = document.querySelector(".js-emaillink"); var range = document.createRange(); range.selectNode(emailLink); window.getSelection().addRange(range); try { // Now that we"ve selected the anchor text, execute the copy command var successful = document.execCommand("copy"); var msg = successful ? "successful" : "unsuccessful"; console.log("Copy email command was " + msg); } catch(err) { console.log("Oops, unable to copy"); } // Remove the selections - NOTE: Should use // removeRange(range) when it is supported window.getSelection().removeAllRanges(); });var time_distance; var totleTime; var stop; function countdownTime(disTime){ time_distance =disTime; totleTime=time_distance; showTime(); } function showTime(){ time_distance=totleTime; var day=0, hour=0, minute=0, second=0;//時間默認值 if(time_distance > 0){ day = Math.floor(time_distance / (60 * 60 * 24*1000)); hour = Math.floor(time_distance / (60 * 60*1000)) - (day * 24); minute = Math.floor(time_distance / (60*1000)) - (day * 24 * 60) - (hour * 60); second = Math.floor(time_distance/1000) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60); } if (hour <= 9) hour = "0" + hour; if (minute <= 9) minute = "0" + minute; if (second <= 9) second = "0" + second; // 顯示時間 $("#time_d").text(day+"天"); $("#time_h").text(hour+"時"); $("#time_m").text(minute+"分"); $("#time_s").text(second+"秒"); stop=setTimeout("showTime()",1000); totleTime=totleTime-1000; if(totleTime<1000){ $("#time_d").text("活動"); $("#time_h").text("已經"); $("#time_m").text("結束"); $("#time_s").text("。"); clearTimeout(stop); } }一個數每隔一秒執行加1并打印出來var count = (function() { var timer; var i = 0; function change(tar) { i++; console.log(i); if (i === tar) { clearTimeout(timer); return false; } timer = setTimeout(function() { change(tar) }, 1000) } return change; })() count(50)onerror log"use strict"; function errorHandler( message, source, lineno, colno, error){ var errorDiv = document.getElementById("error"); errorDiv.classList.remove("hide"); console.log("Error happened, message:", message); console.log("On source file: ", source); console.log("On line - col: ", lineno, "-", colno); console.log("Error:", error); try { var ua = navigator.userAgent; console.log("UA: ", ua); } catch (e) { console.log("Unable to get UA"); } } window.onerror = errorHandler;javascript copy把節點列表(NodeList)轉換為數組"use strict"; function addCopyEventListener(url){ var divs = document.querySelectorAll("div.copyAsText"); for (var index in divs) { if(!divs.hasOwnProperty(index)) { continue; } var div = divs[index]; var input = div.querySelector("input"); var btn = div.querySelector("label"); if (url !== "") { var template = input.getAttribute("data-template"); input.value = template.replace("${url}", url); } void function(btn, input){ btn.addEventListener("click", function(){ if (btn.disabled) { return; } var res = false; try { input.disabled = false; var section = window.getSelection(); section.removeAllRanges(); input.focus(); input.setSelectionRange(0, input.value.length); res = document.execCommand("copy"); input.disabled = true } catch(e) { res = false; } if (res) { var origin = btn.textContent; btn.textContent = "Copied!"; btn.disabled = true; setTimeout(function(){ btn.textContent = origin; btn.disabled = false; }, 2000); } else { window.prompt("Copy to clipboard: Ctrl+C, Enter", input.value); } }); }(btn, input); } } addCopyEventListener(""); //https://github.com/imsobear/blog/issues/31 //只需要對相應的元素綁定 mouseenter 的事件,然后響應 selectText() 這個方法就 ok function selectText (element) { var text = element, range, selection; if (body.createTextRange) { // IE range = body.createTextRange(); range.moveToElementText(text); range.select(); } else if (window.getSelection) { // Others selection = window.getSelection(); range = doc.createRange(); range.selectNodeContents(text); selection.removeAllRanges(); selection.addRange(range); } else { return false; } }var elements = document.querySelectorAll("p"); // NodeList var arrayElements = [].slice.call(elements); // 現在 NodeList 是一個數組 var arrayElements = Array.from(elements); // 這是另一種轉換 NodeList 到 Array 的方法 var array1 = [1,2,3]; var array2 = [4,5,6]; console.log(array1.push.apply(array1, array2)); // [1,2,3,4,5,6];JavaScript實現字符串長度截取function cutstr(str, len) { var temp; var icount = 0; var patrn = /[^x00-xff]/; var strre = ""; for (var i = 0; i < str.length; i++) { if (icount < len - 1) { temp = str.substr(i, 1); if (patrn.exec(temp) == null) { icount = icount + 1 } else { icount = icount + 2 } strre += temp } else { break } } return strre + "..." } function $(id) { return !id ? null : document.getElementById(id); } // 用法:如果地址是 test.htm?t1=1&t2=2&t3=3, 那么能取得:GET["t1"], GET["t2"], GET["t3"] function get_get(){ querystr = window.location.href.split("?") if(querystr[1]){ GETs = querystr[1].split("&") GET =new Array() for(i=0;imockjs讓前端開發獨立于后端100) ? "block": "none" } }; backTop("goTop"); rand numfunction GetRandomNum(Min,Max) { var Range = Max - Min; var Rand = Math.random(); return(Min + Math.round(Rand * Range)); } var num = GetRandomNum(10,100);創建XMLHttpRequest對象function createXHR(){ if(typeof XMLHttpRequest != "undefined"){ return new XMLHttpRequest(); }else if(typeof ActiveXObject != "undefined"){ if(typeof arguments.callee.activeXString != "string"){ var versions = ["MSXML2.XMLHttp.6.0","MSXML2.XMLHttp. 3.0","MSXML2.XMLHttp"],i,len; for(i = 0,len=versions.length;i多行文本溢出顯示省略號=200 && xhr.status<300) || xhr.status== 304){ alert(xhr.responseText); }else{ alert("Request was unsuccessful: " + xhr.status); } } } var module = document.getElementById("clamp-this-module");
微信頁面監聽搖一搖事件,并伴有音效
$clamp(module, {clamp: 3});鼠標向下滾動的時候header會消失//設置下css,加個綠色的背景,明顯 $(".sf-header").css({ background : "#CFC", width: "100%" }); // $(document).scroll( function(){ var me = arguments.callee; //匿名函數可以 通過 arguments.callee 調用自己 me.doc = me.doc || $(document); //緩存 $(document); me.head = me.head || $(".sf-header"); me.lastTop = me.lastTop || me.doc.scrollTop(); if( me.doc.scrollTop() < 20 || me.doc.scrollTop() > me.lastTop ){ //向下 或再 頁面頂部,放在 頭部 me.head.css({ position : "relative" }); }else if( me.doc.scrollTop() < me.lastTop ){ //向上,懸浮 me.head.css({ position : "fixed" }); } me.lastTop = me.doc.scrollTop(); });v2ex 的下一主題window.location. + (Number(document.location.href.replace(/https://www.v2ex.com/t/(d?)/i, "$1"))+1) window.location.href.substring(23,29) * 1 + 1 location.href=location.href.split(/[/#]/)[4]*1+1 location.pathname.substring(3)判斷一個單詞是否是回文function checkPalindrom(str) { return str == str.split("").reverse().join(""); }去掉一組整型數組重復的值let unique = function(arr) { let hashTable = {}; let data = []; for(let i=0,l=arr.length;i統計一個字符串出現最多的字母 function findMaxDuplicateChar(str) { if(str.length == 1) { return str; } let charObj = {}; for(let i=0;i生成斐波那契數組= maxValue) { maxChar = k; maxValue = charObj[k]; } } return maxChar; } function getFibonacci(n) { var fibarr = []; var i = 0; while(i閉包 var myObject = { foo: "bar", func: function() { var self = this; console.log("outer func: this.foo = " + this.foo); console.log("outer func: self.foo = " + self.foo); (function(test) { console.log("inner func: this.foo = " + test.foo); //"bar" console.log("inner func: self.foo = " + self.foo); }(self)); } }; myObject.func(); for(var i = 0; i < 5; i++) { setTimeout(function() { console.log(i); // 555555 }, 1000); } for(var i = 0; i < 5; i++) { (function(i) { setTimeout(function() { console.log(i); //0 , 1 , 2 , 3 , 4 }, 1000); })(i) } function add(num1, num2){ let r1, r2, m; r1 = (""+num1).split(".")[1].length; r2 = (""+num2).split(".")[1].length; m = Math.pow(10,Math.max(r1,r2)); return (num1 * m + num2 * m) / m; } console.log(add(0.1,0.2)); //0.3 console.log(add(0.15,0.2256)); //0.375610 的階乘console.log((function f(n){return ((n > 1) ? n * f(n-1) : n)})(10));
邏輯與返回第一個是 false 的操作數 或者 最后一個是 true 的操作數如果某個操作數為 false ,則該操作數之后的操作數都不會被計算
console.log(1 && 2 && 0); //0
console.log(1 && 0 && 1); //0
console.log(1 && 2 && 3); //3邏輯或返回第一個是 true 的操作數 或者 最后一個是 false 的操作數
console.log(1 || 2 || 0); //1
console.log(0 || 2 || 1); //2
console.log(0 || 0 || false); //false如果某個操作數為 true ,則該操作數之后的操作數都不會被計算
Unicode 編碼轉換
如果邏輯與和邏輯或作混合運算,則邏輯與的優先級高
if 中,[] 和 {} 都表現為 truefunction encodeUTF8(str){ var temp = "",rs = ""; for( var i=0 , len = str.length; i < len; i++ ){ temp = str.charCodeAt(i).toString(16); rs += "u"+ new Array(5-temp.length).join("0") + temp; } return rs; } function decodeUTF8(str){ return str.replace(/(u)(w{4}|w{2})/gi, function($0,$1,$2){ return String.fromCharCode(parseInt($2,16)); }); } encodeUTF8("中文") "u4e2du6587" decodeUTF8("u4e2du6587") "中文" //https://segmentfault.com/q/1010000000095710 var decToHex = function(str) { var res=[]; for(var i=0;i < str.length;i++) res[i]=("00"+str.charCodeAt(i).toString(16)).slice(-4); return "u"+res.join("u"); } var hexToDec = function(str) { str=str.replace(//g,"%"); return unescape(str); } var decodeHtmlEntity = function(str) { return str.replace(/(d+);/g, function(match, dec) { return String.fromCharCode(dec); }); }; var str = "JavaScript高级程序设计"; console.log(decodeHtmlEntity(str));//JavaScript高級程序設計 var encodeHtmlEntity = function(str) { var buf = []; for (var i=str.length-1;i>=0;i--) { buf.unshift(["", str[i].charCodeAt(), ";"].join("")); } return buf.join(""); }; var str = "高級程序設計"; console.log(encodeHtmlEntity(str));//高级程序设计 function u2str(text){ return $("").html(text).text(); }數組反轉var test = [ [1, 0, 4, 3, 2], [0, 4, 3, 2, 1], [4, 3, 2, 1, 0], [3, 2, 1, 0, 4] ]; test.forEach(arr => console.log(reversal(arr))); // 反轉 function reversal(arr) { let len = arr.length; // get max let max = arr[0]; let index = 0; arr.forEach((v, i) => { if (v <= max) return; max = v; index = i; }); // strat re let tmp = arr.reverse().concat(arr, arr); let newIndex = len - 1 - index + len; return tmp.slice(newIndex - index, newIndex + len - index); } var arr = [1, 0, 4, 3, 2]; 反轉為 var arr = [2, 3, 4, 0, 1];chrome consoledir($("selector")) 會返回匹配選擇器的DOM元素的所有屬性
深拷貝 對象和數組
獲取某個DOM元素綁定的事件 getEventListeners($("#firstName")).click[0].listenervar cloneObj = function(obj){ var str, newobj = obj.constructor === Array ? [] : {}; if(typeof obj !== "object"){ return; } else if(window.JSON){ str = JSON.stringify(obj), //系列化對象 newobj = JSON.parse(str); //還原 } else { for(var i in obj){ newobj[i] = typeof obj[i] === "object" ? cloneObj(obj[i]) : obj[i]; } } return newobj; }; //jQuery.extend第一個參數可以是布爾值,用來設置是否深度拷貝的: jQuery.extend(true, { a : { a : "a" } }, { a : { b : "b" } } ); jQuery.extend( { a : { a : "a" } }, { a : { b : "b" } } );ajax提交2個相同的鍵值在form表單中有兩個同name名為"tag",然后在ajax提交的時候直接用serialize進行了序列化 $.post("url", { tags: 7, tags: 128, }) 或者 var str="tags=7&tags=128"; $.ajax({ type:"post", url:"http://localhost/",//地址自己改 data:str, async:true });精度丟失str = "{"a":1234567890123456789,"b":1234567890123239}"; str = str.substr(1); str = str.substr(0,str.length-1); str.split(","); arr = str.split(","); obj = {}; arr.forEach(function(el,index){ var arr1 = el.split(":"); //obj[arr1[0]]=""+arr1[1]; obj[arr1[0]]=(Number.isSafeInteger(arr1[1])?arr1[1]:(""+arr1[1])); }); console.dir(obj); var str = "{"a":1234567890123456789, "b": 1234567890123456789, "c": 1234567890123456789}"; var json = JSON.parse(str.replace(/: *(d*?) *(,|})/g, (a, b, c) => `:"${b}"${c}`)); console.log(json);
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/90973.html
摘要:不包括作為其嵌套函數的被解析的源代碼。作用域鏈當代碼在一個環境中執行時,會創建變量對象的一個作用域鏈。棧結構最頂層的執行環境稱為當前運行的執行環境,最底層是全局執行環境。無限制函數上下文。或者拋出異常退出一個執行環境。 前言 其實規范這東西不是給人看的,它更多的是給語言實現者提供參考。但是當碰到問題找不到答案時,規范往往能提供想要的答案 。偶爾讀一下能夠帶來很大的啟發和思考,如果只讀一...
摘要:引擎會執行其執行環境位于堆棧頂部的函數。當函數執行完畢時,當前執行棧會從堆棧中彈出去,并且控件將會到達其在當前堆棧下面的那個執行環境中。當完成以后,它的執行環境會會從堆棧中移出,并且控件會到達全局執行環境。 如果你想成為一個Javascript開發者,那么你一定要知道Javascript程序的內部運行原理。理解執行環境和執行棧是非常重要的,其有助于理解其他Javascript的概念,比...
摘要:函數是對象理解函數是對象,是準確理解函數的第一步。在中,函數對象和其他對象一樣,均被視為一等公民。當函數執行完畢,其執行環境從棧中彈出并銷毀。此時的函數充當構造器的角色。調用函數對象的方法并將結果賦給。 函數是javascript中最重要的內容,也是其相對其他語言來說在設計上比較有意思的地方。javascript許多高級特性也或多或少和函數相關。本文將以函數為中心,對函數的各個關鍵知識...
摘要:運行執行上下文正在使用的執行上下文。頂部是正在執行的上下文當執行完畢,它的執行上下文自動從棧彈出,控制流程按順序到達全局執行上下文。一旦所有代碼執行完畢,引擎從當前棧中移除全局執行上下文。在全局執行上下文中,的值指向全局對象。 https://juejin.im/post/5ba321...https://juejin.im/entry/59986...我只是搬運工,看了他們的文章后深...
摘要:將消息記錄到控制臺和來說,可通過對象向控制臺中寫入消息。如常見的錯誤操作終止無效字符未找到成員未知運行時錯誤語法錯誤系統無法找到指定資源 將消息記錄到控制臺 console IE8、Firefox、Chrome和Safari來說,可通過console對象向JavaScript控制臺中寫入消息。對象有下列方法: error(message):將錯誤消息記錄到控制臺 info(messa...
摘要:溫馨提示作者的爬坑記錄,對你等大神完全沒有價值,別在我這浪費生命溫馨提示續本文將會成為一篇筆記類型的文章,記錄閉包具體的應用方式溫馨提示再續本文存在錯誤,會慢慢改進的,請不要把我說的當真在上一篇博文閉包不完全探索記錄閉包啥餡的中,對中 溫馨提示:作者的爬坑記錄,對你等大神完全沒有價值,別在我這浪費生命溫馨提示-續:本文(maybe)將會成為一篇筆記類型的文章,記錄閉包具體的應用方式溫馨...
閱讀 3209·2023-04-26 02:27
閱讀 2138·2021-11-22 14:44
閱讀 4082·2021-10-22 09:54
閱讀 3195·2021-10-14 09:43
閱讀 748·2021-09-23 11:53
閱讀 12675·2021-09-22 15:33
閱讀 2704·2019-08-30 15:54
閱讀 2681·2019-08-30 14:04