JS實(shí)用技巧手記（一）

有些代碼，需要的時(shí)候能寫(xiě)的出來(lái)，但是也需要時(shí)間。同時(shí)，如果有的東西長(zhǎng)時(shí)間不接觸，再次看的時(shí)候也會(huì)感覺(jué)很陌生，本系列文章旨在記錄一些實(shí)用的javascript技巧，既可以作為一個(gè)知識(shí)的積累，又可以作為閑暇時(shí)打發(fā)時(shí)間寫(xiě)寫(xiě)代碼的記錄。同時(shí)也方便日后翻閱~

1.”金錢(qián)“格式轉(zhuǎn)換

運(yùn)用點(diǎn)：所謂的金錢(qián)格式轉(zhuǎn)換就是把數(shù)字轉(zhuǎn)換成三位數(shù)加一個(gè)逗號(hào)的格式，使數(shù)據(jù)變得很直觀明了~

例子： 就像這里的贊功能，點(diǎn)擊之后加1，再次點(diǎn)擊減1，很簡(jiǎn)單實(shí)現(xiàn)。但是數(shù)據(jù)是字符串的，加減錢(qián)需要用正則轉(zhuǎn)換成數(shù)字，但是再顯示最后結(jié)果時(shí)，也需要再次轉(zhuǎn)換成金錢(qián)的格式，再通過(guò)ajax實(shí)現(xiàn)數(shù)據(jù)的交互。下面來(lái)看下怎么實(shí)現(xiàn)的 這個(gè)是正則，把字符串轉(zhuǎn)換成數(shù)字之后，能直接進(jìn)行運(yùn)算:如把1,561,124轉(zhuǎn)換成1561124

var sLove=document.getElementById("love");  //slove = 1,561,124
var reg=sLove1.innerHTML.replace(/,/g,"");  //reg = 1561124

下面的這個(gè)是數(shù)字轉(zhuǎn)換成金錢(qián)格式的函數(shù)，也很容易理解

function formatCash(cash){
        var str_cash = cash + "";//轉(zhuǎn)換成字符串
        var ret_cash = "";
        var counter = 0;
        for(var i=str_cash.length-1;i>=0;i--){
            ret_cash = str_cash.charAt(i) + ret_cash;
            counter++;
            if(counter==3){
                counter = 0;
                if(i!=0){
                ret_cash = "," + ret_cash;
                }
            }}
        return ret_cash;
    }
// demo:
var num = 1012145;
formatCash(num);   //1,012,145

2.window.onload使用多次

運(yùn)用點(diǎn)：window.onload只能使用一次，而不像JQ那樣能只用多次，下面的這個(gè)函數(shù)就可以實(shí)現(xiàn)多次使用onload的功能

function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function() {
            oldonload();
            func();
        }
    }
}
// demo：
addLoadEvent(fnName);  //可使用多次

3.insertafter在結(jié)點(diǎn)后面插入內(nèi)容

運(yùn)用點(diǎn)：js給我們提供了insertbefore，沒(méi)有before，下面這個(gè)函數(shù)就實(shí)現(xiàn)了這個(gè)功能

// insertAfter
function insertAfter(newElement,targetElement){
  var parent=targetElement.parentNode;
  if(parent.lastChild==targetElement){
    parent.appendChild(newElement);
    } else{
      parent.insertBefore(newElement,targetElement.nextSibling);
      }
  }
 

4. 隨機(jī)數(shù)生成

var rnd = Math.random(); //返回0-1之間的任意小數(shù)
var rnd = Math.floor(Math.random() * n); //返回0-n之間的任意整數(shù)(不包括n)

5. X進(jìn)制數(shù)字的轉(zhuǎn)換

var i = parseInt("0x1f",16); //31
var i = parseInt(i,10); //31
var i = parseInt("11010011",2); //211

6. 格式化顯示數(shù)字

var i = 3.14159;
//格式化為兩位小數(shù)的浮點(diǎn)數(shù)
var str = i.toFixed(2); //結(jié)果: "3.14"
//格式化為五位數(shù)字的浮點(diǎn)數(shù)(從左到右五位數(shù)字,不夠補(bǔ)零)
var str = i.toPrecision(5); //結(jié)果: "3.1415"

7. 小數(shù)轉(zhuǎn)整數(shù)

var f = 1.5;
var i = Math.round(f); //結(jié)果:2 (四舍五入)
var i = Math.ceil(f); //結(jié)果:2 (返回大于f的最小整數(shù))
var i = Math.floor(f); //結(jié)果:1 (返回小于f的最大整數(shù))

8. 異常捕獲

try{ expression } catch(e){ } finally{}
//不處理任何異常
window.onerror = doNothing;
function doNothing(){ return true; }
//異常類可用的屬性
description : 異常描述(IE,NN)
fileName : 異常頁(yè)面URI(NN)
lineNumber : 異常行數(shù)(NN)
message : 異常描述(IE,NN)
name : 錯(cuò)誤類型(IE,NN)
number : 錯(cuò)誤代碼(IE)
//錯(cuò)誤信息(兼容所有瀏覽器)
try{}
catch(e){
    var msg = (e.message) ? e.message : e.description;
    alert(msg);
}

9. 延遲函數(shù)調(diào)用

var tId = setTimeout("myFun()",1000); //延遲1000毫秒后再調(diào)用myFun()函數(shù)
fucntion myFun(){
    //do something
    clearTimeout(tId); //銷(xiāo)毀對(duì)象
}

10. 字符串與數(shù)字間的轉(zhuǎn)換

var i = 1;
var str = i.toString(); //結(jié)果: "1"
var str = new String(i); //結(jié)果: "1"
i = parseInt(str); //結(jié)果: 1
i = parseFloat(str); //結(jié)果: 1.0
//注意: parseInt,parseFloat會(huì)把一個(gè)類似于"32G"的字符串,強(qiáng)制轉(zhuǎn)換成32

更新于2013/11/17  軒楓