JS實(shí)用技巧手記(三)

2018-06-17 19:24 更新

本系列文章旨在記錄一些實(shí)用的javascript技巧,既可以作為一個(gè)知識(shí)的積累,又可以作為閑暇時(shí)打發(fā)時(shí)間寫(xiě)寫(xiě)代碼的記錄。同時(shí)也方便日后翻閱~

1. 用戶(hù)判斷給定的對(duì)象是否是數(shù)組

1
2
3
4
5
6
function isArray(o){
    return Object.prototype.toString.call(o)==='[object Array]';
}
// demo:
isArray("str");  //false
isArray([1,2]);  //true

 

2. 判斷檢查數(shù)組中是否存在某個(gè)值

1
2
3
4
5
6
7
8
9
10
Array.prototype.inArray = function(e) {
    for(i=0;i < this.length;i++)
    {
        if(this[i] == e)
        return true;
    }
    return false;
}
// demo:
[1,2].inArray(1);  //true

 

3. 用來(lái)顯示或隱藏一個(gè)DOM元素

1
2
3
4
5
6
7
8
9
10
11
function toggle(obj){
    var el = document.getElementById(obj);  
    if ( el.style.display != 'none' ) {  
        el.style.display = 'none';  
    }
    else {  
        el.style.display = '';  
    }  
}
// demo:
oDiv.onclick = toggle("id");

 

4. 加載樣式文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function LoadStyle(url) {
    try {
        document.createStyleSheet(url)
    } catch(e) {
        var cssLink = document.createElement('link');
        cssLink.rel = 'stylesheet';
        cssLink.type = 'text/css';
        cssLink.href = url;
        var head = document.getElementsByTagName('head')[0];
        head.appendChild(cssLink)
    }
}
// demo:
LoadStyle("css/style.css");

 

5. 清除腳本內(nèi)容

1
2
3
function stripscript(s) {
    return s.replace(/<script.*?>.*?<\/script>/ig, '');
}

 

6. 解析獲取URL參數(shù)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
function getUrlParm(url, parm)
{
    var thisUrl=url;
    var parmValue="";
    var re=new RegExp(parm+"=.*", "i");
    var mResult=re.exec(thisUrl);
    if(mResult!=null){
        mResult=mResult[0];
        alert(mResult);
        if(mResult.indexOf("&")!=-1)
            mResult=mResult.split("&")[0];
        alert(parm+" value is "+mResult.split("=")[1]);  //return mResult.split("=")[1];
    }
}
// demo:
getUrlParm("http://www.xuanfeng.com/login?user=chris","user");
// user=chris
// user value is chris

 

7. 判斷是否為有效的數(shù)字

1
2
3
4
5
6
var i = 123; var str = "string";
if( typeof i == "number" ){ } //true
//某些方法(如:parseInt,parseFloat)會(huì)返回一個(gè)特殊的值NaN(Not a Number)
//請(qǐng)注意第2點(diǎn)中的[注意],此方法不完全適合判斷一個(gè)字符串是否是數(shù)字型!!
i = parseInt(str);
if( isNaN(i) ){ }  //true

 

8. 獲取時(shí)間的某部份

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var myDate = new Date();
myDate.getYear(); //獲取當(dāng)前年份(2位)
myDate.getFullYear(); //獲取完整的年份(4位,1970-????)
myDate.getMonth(); //獲取當(dāng)前月份(0-11,0代表1月)
myDate.getDate(); //獲取當(dāng)前日(1-31)
myDate.getDay(); //獲取當(dāng)前星期X(0-6,0代表星期天)
myDate.getTime(); //獲取當(dāng)前時(shí)間(從1970.1.1開(kāi)始的毫秒數(shù))
myDate.getHours(); //獲取當(dāng)前小時(shí)數(shù)(0-23)
myDate.getMinutes(); //獲取當(dāng)前分鐘數(shù)(0-59)
myDate.getSeconds(); //獲取當(dāng)前秒數(shù)(0-59)
myDate.getMilliseconds(); //獲取當(dāng)前毫秒數(shù)(0-999)
myDate.toLocaleDateString(); //獲取當(dāng)前日期
myDate.toLocaleTimeString(); //獲取當(dāng)前時(shí)間
myDate.toLocaleString( ); //獲取日期與時(shí)間

 

9. 事件源對(duì)象

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
event.srcElement.tagName
event.srcElement.type
// 捕獲釋放
event.srcElement.setCapture();
event.srcElement.releaseCapture();
// 事件按鍵
event.keyCode
event.shiftKey
event.altKey
event.ctrlKey
// 事件返回值
event.returnValue
// 鼠標(biāo)位置
event.x
event.y

 

10. 元素顯示的通用方法

1
2
3
4
5
6
7
8
9
10
11
function $(id) {
    return !id ? null : document.getElementById(id);
}
function display(id) {
    var obj = $(id);
    if(obj.style.visibility) {
        obj.style.visibility = obj.style.visibility == 'visible' ? 'hidden' : 'visible';
    } else {
        obj.style.display = obj.style.display == '' ? 'none' : '';
    }
}
以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)