經常使用JS整理

時間  2019-12-28
標籤 經常 使用 整理 欄目 JavaScript 简体版
原文   原文鏈接

正則

金額 8位整數 兩位小數 
/^[0-9]{1,8}(\.\d{1,2})?$/
計算不丟失精度
var CMX = CMX || {};
/**
 ** 加
 **/
CMX.add = function (arg1, arg2) {
    var r1, r2, m, c;
    try {
        r1 = arg1.toString().split(".")[1].length;
    }
    catch (e) {
        r1 = 0;
    }
    try {
        r2 = arg2.toString().split(".")[1].length;
    }
    catch (e) {
        r2 = 0;
    }
    c = Math.abs(r1 - r2);
    m = Math.pow(10, Math.max(r1, r2));
    if (c > 0) {
        var cm = Math.pow(10, c);
        if (r1 > r2) {
            arg1 = Number(arg1.toString().replace(".", ""));
            arg2 = Number(arg2.toString().replace(".", "")) * cm;
        } else {
            arg1 = Number(arg1.toString().replace(".", "")) * cm;
            arg2 = Number(arg2.toString().replace(".", ""));
        }
    } else {
        arg1 = Number(arg1.toString().replace(".", ""));
        arg2 = Number(arg2.toString().replace(".", ""));
    }
    return (arg1 + arg2) / m;
};

/**
 ** 減
 **/
CMX.sub = function (arg1, arg2) {
    var r1, r2, m, n;
    try {
        r1 = arg1.toString().split(".")[1].length;
    }
    catch (e) {
        r1 = 0;
    }
    try {
        r2 = arg2.toString().split(".")[1].length;
    }
    catch (e) {
        r2 = 0;
    }
    m = Math.pow(10, Math.max(r1, r2)); //last modify by deeka //動態控制精度長度
    n = (r1 >= r2) ? r1 : r2;
    return Number(((arg1 * m - arg2 * m) / m).toFixed(n));
};

/**
 ** 乘
 **/
    CMX.mul = function (arg1, arg2) {
        var m = 0, s1 = arg1.toString(), s2 = arg2.toString();
        try {
            m += s1.split(".")[1].length;
        }
        catch (e) {
        }
        try {
            m += s2.split(".")[1].length;
        }
        catch (e) {
        }
        return Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m);
    };

/**
 ** 除
 **/
CMX.div = function (arg1, arg2) {
    var t1 = 0, t2 = 0, r1, r2;
    try {
        t1 = arg1.toString().split(".")[1].length;
    }
    catch (e) {
    }
    try {
        t2 = arg2.toString().split(".")[1].length;
    }
    catch (e) {
    }
    with (Math) {
        r1 = Number(arg1.toString().replace(".", ""));
        r2 = Number(arg2.toString().replace(".", ""));
        return (r1 / r2) * pow(10, t2 - t1);
    }
};

COOKIE

var cookie_operate = {
        set:function(key,val,time){//設置cookie方法
            var date=new Date(); //獲取當前時間
            var expiresDays=time;  //將date設置爲n天之後的時間
            date.setTime(date.getTime()+expiresDays*24*3600*1000); //格式化爲cookie識別的時間
            document.cookie=key + "=" + val +";expires="+date.toGMTString();  //設置cookie
        },
        get:function(key){//獲取cookie方法
            /*獲取cookie參數*/
            debugger
            var getCookie = document.cookie.replace(/[ ]/g,"");  //獲取cookie，而且將得到的cookie格式化，去掉空格字符
            var arrCookie = getCookie.split(";")  //將得到的cookie以"分號"爲標識 將cookie保存到arrCookie的數組中
            var tips;  //聲明變量tips
            for(var i=0;i<arrCookie.length;i++){   //使用for循環查找cookie中的tips變量
                var arr=arrCookie[i].split("=");   //將單條cookie用"等號"爲標識，將單條cookie保存爲arr數組
                if(key==arr[0]){  //匹配變量名稱，其中arr[0]是指的cookie名稱，若是該條變量爲tips則執行判斷語句中的賦值操做
                    tips=arr[1];   //將cookie的值賦給變量tips
                    break;   //終止for循環遍歷
                }
            }
            return tips
        },
        delete:function(key){ //刪除cookie方法
            var date = new Date(); //獲取當前時間
            date.setTime(date.getTime()-10000); //將date設置爲過去的時間
            document.cookie = key + "=v; expires =" +date.toGMTString();//設置cookie
            return tips;
        }
    };

RADIO

寫法 
<input type="radio" name="list" value="十分滿意" />十分滿意
   <input type="radio" name="list" value="滿意" />滿意
   <input type="radio" name="list" value="不滿意" />不滿意
   <input type="radio" name="list" value="很是差" />很是差
取值 
var re = $('input[name="redio的name值"]:checked').val();

js

oninput 
<input type="text" oninput="myFunction()">
oninput 事件在用戶輸入時觸發。

該事件在 < input> 或 < textarea> 元素的值發生改變時觸發。
提示： 該事件相似於 onchange 事件。不一樣之處在於 oninput 事件在元素值發生變化是當即觸發， onchange 在元素失去焦點時觸發。另一點不一樣是 onchange 事件也能夠做用於 < keygen> 和 < select> 元素。正則表達式

對象的深淺拷貝

var obj = {a:{b:10}};
function copy(obj){
    var newobj = {};
    for ( var attr in obj) {
        newobj[attr] = obj[attr];
    }
    return newobj;
}
var obj2 = copy(obj);
obj2.a.b = 20;
alert(obj.a.b); //20
深拷貝 
var obj = {a:{b:10}};
function deepCopy(obj){
    if(typeof obj != 'object'){
        return obj;
    }
    var newobj = {};
    for ( var attr in obj) {
        newobj[attr] = deepCopy(obj[attr]);
    }
    return newobj;
}
var obj2 = deepCopy(obj);
obj2.a.b = 20;
alert(obj.a.b); //10

Js正則

JS正則表達式有兩種一種是 普通方式，一種是構造函數形式數組

  • 普通方式：var reg=/表達式/附加參數
  • 構造函數方式：var reg=new RegExp(「表達式」,」附加參數」);
普通方式與構造函數方式的區別
普通方式中的表達式必須是一個常量字符串，而構造函數中的表達式能夠是常量字符串，也能夠是一個js變量，例如根據用戶的輸入來做爲表達式參數等等： 
var reg=new RegExp(document.forms[0].exprfiled.value,」g」);

| 表達式|可匹配 |
| :-------- | --------:|
| /d | 任意一個數字，0~9 中的任意一個 |
| /w | 任意一個字母或數字或下劃線，也就是 A~Z,a~z,0~9,_ 中任意一個 |
| /s| 包括空格、製表符、換頁符等空白字符的其中任意一個 |
|[ab5@]| 匹配 "a" 或 "b" 或 "5" 或 "@"|
|1| 匹配 "a","b","c" 以外的任意一個字符|
|[f-k]| 匹配 "f"~"k" 之間的任意一個字母|
|2 |匹配 "A"~"F","0"~"3" 以外的任意一個字符|
| . | 小數點能夠匹配除了換行符（/n）之外的任意一個字符 |cookie

舉例1：表達式 "/d/d"，在匹配 "abc123" 時，匹配的結果是：成功；匹配到的內容是："12"；匹配到的位置是：開始於3，結束於5。

舉例2：表達式 "a./d"，在匹配 "aaa100" 時，匹配的結果是：成功；匹配到的內容是："aa1"；匹配到的位置是：開始於1，結束於4。函數

舉例3：表達式 "bcd" 匹配 "abc123" 時，匹配的結果是：成功；匹配到的內容是："bc"；匹配到的位置是：開始於1，結束於3。debug

舉例4：表達式 "1" 匹配 "abc123" 時，匹配的結果是：成功；匹配到的內容是："1"；匹配到的位置是：開始於3，結束於4。code

前面章節中講到的表達式，不管是隻能匹配一種字符的表達式，仍是能夠匹配多種字符其中任意一個的表達式，都只能匹配一次。若是使用表達式再加上修飾匹配次數的特殊符號，那麼不用重複書寫表達式就能夠重複匹配。orm

使用方法是："次數修飾"放在"被修飾的表達式"後邊。好比："[bcd][bcd]" 能夠寫成 "[bcd]{2}"。
Alt text對象

Alt text

舉例1：表達式 "^aaa" 在匹配 "xxx aaa xxx" 時，匹配結果是：失敗。由於 "^" 要求與字符串開始的地方匹配，所以，只有當 "aaa" 位於字符串的開頭的時候，"^aaa" 才能匹配，好比："aaa xxx xxx"。

舉例2：表達式 "aaa$" 在匹配 "xxx aaa xxx" 時，匹配結果是：失敗。由於 "$" 要求與字符串結束的地方匹配，所以，只有當 "aaa" 位於字符串的結尾的時候，"aaa$" 才能匹配，好比："xxx xxx aaa"。排序

舉例3：表達式 "./b." 在匹配 "@@@abc" 時，匹配結果是：成功；匹配到的內容是："@a"；匹配到的位置是：開始於2，結束於4。事件

進一步說明："/b" 與 "^" 和 "$" 相似，自己不匹配任何字符，可是它要求它在匹配結果中所處位置的左右兩邊，其中一邊是 "/w" 範圍，另外一邊是 非"/w" 的範圍。
舉例4：表達式 "/bend/b" 在匹配 "weekend,endfor,end" 時，匹配結果是：成功；匹配到的內容是："end"；匹配到的位置是：開始於15，結束於18。
Alt text
在使用修飾匹配次數的特殊符號時，有幾種表示方法可使同一個表達式可以匹配不一樣的次數，好比："{m,n}", "{m,}", "?", "*", "+"，具體匹配的次數隨被匹配的字符串而定。這種重複匹配不定次數的表達式在匹配過程當中，老是儘量多的匹配。好比，針對文本 "dxxxdxxxd"，舉例以下：

Alt text

因而可知，"/w+" 在匹配的時候，老是儘量多的匹配符合它規則的字符。雖然第二個舉例中，它沒有匹配最後一個 "d"，但那也是爲了讓整個表達式可以匹配成功。同理，帶 "*" 和 "{m,n}" 的表達式都是儘量地多匹配，帶 "?" 的表達式在可匹配可不匹配的時候，也是儘量的 "要匹配"。這 種匹配原則就叫做 "貪婪" 模式 。

非貪婪模式：
在修飾匹配次數的特殊符號後再加上一個 "?" 號，則可使匹配次數不定的表達式儘量少的匹配，使可匹配可不匹配的表達式，儘量的 "不匹配"。這種匹配原則叫做 "非貪婪" 模式，也叫做 "勉強" 模式。若是少匹配就會致使整個表達式匹配失敗的時候，與貪婪模式相似，非貪婪模式會最小限度的再匹配一些，以使整個表達式匹配成功。舉例以下，針對文本 "dxxxdxxxd" 舉例：
Alt text
舉例1：表達式 "< td>(.*)< /td>" 與字符串 "< td>< p>aa< /p>< /td> < td>< p>bb< /p>< /td>" 匹配時，匹配的結果是：成功；匹配到的內容是 "< td>< p>aa< /p>< /td> < td>< p>bb< /p>< /td>" 整個字符串， 表達式中的 "< /td>" 將與字符串中最後一個 "< /td>" 匹配。

舉例2：相比之下，表達式 "< td>(.*?)< /td>" 匹配舉例1中一樣的字符串時，將只獲得 "< td> < p>aa< /p>< /td>"， 再次匹配下一個時，能夠獲得第二個 "< td>< p>bb< /p>< /td>"。
表達式在匹配時，表達式引擎會將小括號 "( )" 包含的表達式所匹配到的字符串記錄下來。在獲取匹配結果的時候，小括號包含的表達式所匹配到的字符串能夠單獨獲取。這一點，在前面的舉例中，已經屢次展現了。在實際應用場合中，當用某種邊界來查找，而所要獲取的內容又不包含邊界時，必須使用小括號來指定所要的範圍。好比前面的 "<td>(.*?)</td>"。

其實，"小括號包含的表達式所匹配到的字符串" 不只是在匹配結束後纔可使用，在匹配過程當中也可使用。表達式後邊的部分，能夠引用前面 "括號內的子匹配已經匹配到的字符串"。引用方法是 "/" 加上一個數字。"/1" 引用第1對括號內匹配到的字符串，"/2" 引用第2對括號內匹配到的字符串……以此類推，若是一對括號內包含另外一對括號，則外層的括號先排序號。換句話說，哪一對的左括號 "(" 在前，那這一對就先排序號。

舉例以下：

舉例1：表達式 "('|")(.*?)(/1)" 在匹配 " 'Hello', "World" " 時，匹配結果是：成功；匹配到的內容是：" 'Hello' "。再次匹配下一個時，能夠匹配到 " "World" "。

舉例2：表達式 "(/w)/1{4,}" 在匹配 "aa bbbb abcdefg ccccc 111121111 999999999" 時，匹配結果是：成功；匹配到的內容是 "ccccc"。再次匹配下一個時，將獲得 999999999。這個表達式要求 "/w" 範圍的字符至少重複5次，注意與 "/w{5,}" 之間的區別。

舉例3：表達式 "<(/w+)/s*(/w+(=('|").*?/4)?/s*)*>.*?<//1>" 在匹配 "<td id='td1' style="bgcolor:white"></td>" 時，匹配結果是成功。若是 "<td>" 與 "</td>" 不配對，則會匹配失敗；若是改爲其餘配對，也能夠匹配成功。

Alt text
Alt text
Alt text
Alt text

附加參數：用來擴展表達式的含義，目前主要有三個參數：

  • g：表明能夠進行全局匹配。
  • i：表明不區分大小寫匹配。
  • m：表明能夠進行多行匹配。
if (event.stopPropagation()) {//阻止點擊事件向上冒泡
        event.stopPropagation();
    } else {
        window.event.cancelBubble = true;

我是一條小尾巴~~~~~~~~~~

  1. abc ↩
  2. A-F0-3 ↩
相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程