JS实用技巧手记（一）

有些代码，需要的时候能写的出来，但是也需要时间。同时，如果有的东西长时间不接触，再次看的时候也会感觉很陌生，本系列文章旨在记录一些实用的javascript技巧，既可以作为一个知识的积累，又可以作为闲暇时打发时间写写代码的记录。同时也方便日后翻阅~

1.”金钱“格式转换

运用点：所谓的金钱格式转换就是把数字转换成三位数加一个逗号的格式，使数据变得很直观明了~

例子： 就像这里的赞功能，点击之后加1，再次点击减1，很简单实现。但是数据是字符串的，加减钱需要用正则转换成数字，但是再显示最后结果时，也需要再次转换成金钱的格式，再通过ajax实现数据的交互。下面来看下怎么实现的 这个是正则，把字符串转换成数字之后，能直接进行运算:如把1,561,124转换成1561124

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

下面的这个是数字转换成金钱格式的函数，也很容易理解

function formatCash(cash){
        var str_cash = cash + "";//转换成字符串
        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使用多次

运用点：window.onload只能使用一次，而不像JQ那样能只用多次，下面的这个函数就可以实现多次使用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在结点后面插入内容

运用点：js给我们提供了insertbefore，没有before，下面这个函数就实现了这个功能

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

4. 随机数生成

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

5. X进制数字的转换

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

6. 格式化显示数字

var i = 3.14159;
//格式化为两位小数的浮点数
var str = i.toFixed(2); //结果: "3.14"
//格式化为五位数字的浮点数(从左到右五位数字,不够补零)
var str = i.toPrecision(5); //结果: "3.1415"

7. 小数转整数

var f = 1.5;
var i = Math.round(f); //结果:2 (四舍五入)
var i = Math.ceil(f); //结果:2 (返回大于f的最小整数)
var i = Math.floor(f); //结果:1 (返回小于f的最大整数)

8. 异常捕获

try{ expression } catch(e){ } finally{}
//不处理任何异常
window.onerror = doNothing;
function doNothing(){ return true; }
//异常类可用的属性
description : 异常描述(IE,NN)
fileName : 异常页面URI(NN)
lineNumber : 异常行数(NN)
message : 异常描述(IE,NN)
name : 错误类型(IE,NN)
number : 错误代码(IE)
//错误信息(兼容所有浏览器)
try{}
catch(e){
    var msg = (e.message) ? e.message : e.description;
    alert(msg);
}

9. 延迟函数调用

var tId = setTimeout("myFun()",1000); //延迟1000毫秒后再调用myFun()函数
fucntion myFun(){
    //do something
    clearTimeout(tId); //销毁对象
}

10. 字符串与数字间的转换

var i = 1;
var str = i.toString(); //结果: "1"
var str = new String(i); //结果: "1"
i = parseInt(str); //结果: 1
i = parseFloat(str); //结果: 1.0
//注意: parseInt,parseFloat会把一个类似于"32G"的字符串,强制转换成32

更新于2013/11/17  轩枫