JavasSript 技巧(2)

1 篇文章 / 0 new
author
JavasSript 技巧(2)
36、原生JavaScript判斷是否在安卓上的谷歌瀏覽器

    function isNewChromeOnAndroid(){
            if(this.isAndroidMobileDevice()){
                    var userAgent = navigator.userAgent.toLowerCase();
                    if((/chrome/i.test(userAgent))){
                            var parts = userAgent.split('chrome/');
                            var fullVersionString = parts[1].split(" ")[0];
                            var versionString = fullVersionString.split('.')[0];
                            var version = parseInt(versionString);
                            if(version >= 27){
                                    return true;
                            }
                    }
            }
            return false;
    }

37、原生JavaScript判斷是否打開視窗

    function isViewportOpen() {
            return !!document.getElementById('wixMobileViewport');
    }

38、原生JavaScript獲取移動設備初始化大小

    function getInitZoom(){
            if(!this._initZoom){
                    var screenWidth = Math.min(screen.height, screen.width);
                    if(this.isAndroidMobileDevice() && !this.isNewChromeOnAndroid()){
                            screenWidth = screenWidth/window.devicePixelRatio;
                    }
                    this._initZoom = screenWidth /document.body.offsetWidth;
            }
            return this._initZoom;
    }

39、原生JavaScript獲取移動設備最大化大小

    function getZoom(){
            var screenWidth = (Math.abs(window.orientation) === 90) ? Math.max(screen.height, screen.width) : Math.min(screen.height, screen.width);
            if(this.isAndroidMobileDevice() && !this.isNewChromeOnAndroid()){
                    screenWidth = screenWidth/window.devicePixelRatio;
            }
            var FixViewPortsExperiment = rendererModel.runningExperiments.FixViewport || rendererModel.runningExperiments.fixviewport;
            var FixViewPortsExperimentRunning = FixViewPortsExperiment && (FixViewPortsExperiment === "New" || FixViewPortsExperiment === "new");
            if(FixViewPortsExperimentRunning){
                    return screenWidth / window.innerWidth;
            }else{
                    return screenWidth / document.body.offsetWidth;
            }
    }

40、原生JavaScript獲取移動設備屏幕寬度

    function getScreenWidth(){
            var smallerSide = Math.min(screen.width, screen.height);
            var fixViewPortsExperiment = rendererModel.runningExperiments.FixViewport || rendererModel.runningExperiments.fixviewport;
            var fixViewPortsExperimentRunning = fixViewPortsExperiment && (fixViewPortsExperiment.toLowerCase() === "new");
            if(fixViewPortsExperiment){
                    if(this.isAndroidMobileDevice() && !this.isNewChromeOnAndroid()){
                            smallerSide = smallerSide/window.devicePixelRatio;
                    }
            }
            return smallerSide;
    }

41、原生 JavaScript完美判斷是否為網址

    function IsURL(strUrl) {
        var regular = /^\b(((https?|ftp):\/\/)?[-a-z0-9]+(\.[-a-z0-9]+)*\.(?:com|edu|gov|int|mil|net|org|biz|info|name|museum|asia|coop|aero|[a-z][a-z]|((25[0-5])|(2[0-4]\d)|(1\d\d)|([1-9]\d)|\d))\b(\/[-a-z0-9_:\@&?=+,.!\/~%\$]*)?)$/i
        if (regular.test(strUrl)) {
            return true;
        }
        else {
            return false;
        }
    }

42、原生JavaScript根據樣式名稱檢索元素對像

    function getElementsByClassName(name) {
        var tags = document.getElementsByTagName('*') || document.all;
        var els = [];
        for (var i = 0; i < tags.length; i++) {
            if (tags.className) {
                var cs = tags.className.split(' ');
                for (var j = 0; j < cs.length; j++) {
                    if (name == cs[j]) {
                        els.push(tags);
                        break
                    }
                }
            }
        }
        return els
    }

43、原生JavaScript判斷是否以某個字符串開頭

    String.prototype.startWith = function (s) {
        return this.indexOf(s) == 0
    }

44、原生JavaScript判斷是否以某個字符串結束

    String.prototype.endWith = function (s) {
        var d = this.length - s.length;
        return (d >= 0 && this.lastIndexOf(s) == d)
    }

45、原生JavaScript返回IE瀏覽器的版本號

    function getIE(){
        if (window.ActiveXObject){
            var v = navigator.userAgent.match(/MSIE ([^;]+)/)[1];
            return parseFloat(v.substring(0, v.indexOf(".")))
        }
        return false
    }

46、原生JavaScript獲取頁面高度

    function getPageHeight(){
            var g = document, a = g.body, f = g.documentElement, d = g.compatMode == "BackCompat"
                            ? a
                            : g.documentElement;
            return Math.max(f.scrollHeight, a.scrollHeight, d.clientHeight);
    }

47、原生JavaScript獲取頁面scrollLeft

    function getPageScrollLeft(){
            var a = document;
            return a.documentElement.scrollLeft || a.body.scrollLeft;
    }

48、原生JavaScript獲取頁面可視寬度

    function getPageViewWidth(){
            var d = document, a = d.compatMode == "BackCompat"
                            ? d.body
                            : d.documentElement;
            return a.clientWidth;
    }

49、原生JavaScript獲取頁面寬度

    function getPageWidth(){
            var g = document, a = g.body, f = g.documentElement, d = g.compatMode == "BackCompat"
                            ? a
                            : g.documentElement;
            return Math.max(f.scrollWidth, a.scrollWidth, d.clientWidth);
    }

50、原生JavaScript獲取頁面scrollTop

    function getPageScrollTop(){
            var a = document;
            return a.documentElement.scrollTop || a.body.scrollTop;
    }

51、原生JavaScript獲取頁面可視高度

    function getPageViewHeight() {
            var d = document, a = d.compatMode == "BackCompat"
                            ? d.body
                            : d.documentElement;
            return a.clientHeight;
    }

52、原生JavaScript跨瀏覽器添加事件

    function addEvt(oTarget,sEvtType,fnHandle){
            if(!oTarget){return;}
            if(oTarget.addEventListener){
                    oTarget.addEventListener(sEvtType,fnHandle,false);
            }else if(oTarget.attachEvent){
                    oTarget.attachEvent("on" + sEvtType,fnHandle);
            }else{
                    oTarget["on" + sEvtType] = fnHandle;
            }
    }

53、原生JavaScript跨瀏覽器刪除事件

    function delEvt(oTarget,sEvtType,fnHandle){
            if(!oTarget){return;}
            if(oTarget.addEventListener){
                    oTarget.addEventListener(sEvtType,fnHandle,false);
            }else if(oTarget.attachEvent){
                    oTarget.attachEvent("on" + sEvtType,fnHandle);
            }else{
                    oTarget["on" + sEvtType] = fnHandle;
            }
    }

54、原生JavaScript去掉url前綴

    function removeUrlPrefix(a){
      a=a.replace(/:/g,":").replace(/./g,".").replace(///g,"/");
      while(trim(a).toLowerCase().indexOf("http://")==0){
        a=trim(a.replace(/http:\/\//i,""));
      }
      return a;
    }

55、原生JavaScript隨機數時間戳

    function uniqueId(){
            var a=Math.random,b=parseInt;
            return Number(new Date()).toString()+b(10*a())+b(10*a())+b(10*a());
    }

56、原生JavaScript全角半角轉換,iCase: 0全到半,1半到全,其他不轉化

    function chgCase(sStr,iCase){
            if(typeof sStr != "string" || sStr.length <= 0 || !(iCase === 0 || iCase == 1)){
                    return sStr;
            }
            var i,oRs=[],iCode;
            if(iCase){/*半->全*/
                    for(i=0; i<sStr.length;i+=1){
                            iCode = sStr.charCodeAt(i);
                            if(iCode == 32){
                                    iCode = 12288;                               
                            }else if(iCode < 127){
                                    iCode += 65248;
                            }
                            oRs.push(String.fromCharCode(iCode));
                    }               
            }else{/*全->半*/
                    for(i=0; i<sStr.length;i+=1){
                            iCode = sStr.charCodeAt(i);
                            if(iCode == 12288){
                                    iCode = 32;
                            }else if(iCode > 65280 && iCode < 65375){
                                    iCode -= 65248;                               
                            }
                            oRs.push(String.fromCharCode(iCode));
                    }               
            }               
            return oRs.join("");               
    }

57、原生JavaScript確認是否鍵盤有效輸入值

    function checkKey(iKey){
            if(iKey == 32 || iKey == 229){return true;}/*空格和異常*/
            if(iKey>47 && iKey < 58){return true;}/*數字*/
            if(iKey>64 && iKey < 91){return true;}/*字母*/
            if(iKey>95 && iKey < 108){return true;}/*數字鍵盤1*/
            if(iKey>108 && iKey < 112){return true;}/*數字鍵盤2*/
            if(iKey>185 && iKey < 193){return true;}/*符號1*/
            if(iKey>218 && iKey < 223){return true;}/*符號2*/
            return false;
    }

58、原生JavaScript獲取網頁被捲去的位置

    function getScrollXY() {
        return document.body.scrollTop ? {
            x: document.body.scrollLeft,
            y: document.body.scrollTop
        }: {
            x: document.documentElement.scrollLeft,
            y: document.documentElement.scrollTop
        }
    }

59、原生JavaScript另一種正則日期格式化函數+調用方法

    Date.prototype.format = function(format){ //author: meizz
      var o = {
        "M+" : this.getMonth()+1, //month
        "d+" : this.getDate(),    //day
        "h+" : this.getHours(),   //hour
        "m+" : this.getMinutes(), //minute
        "s+" : this.getSeconds(), //second
        "q+" : Math.floor((this.getMonth()+3)/3),  //quarter
        "S" : this.getMilliseconds() //millisecond
      }
      if(/(y+)/.test(format)) format=format.replace(RegExp.$1,
        (this.getFullYear()+"").substr(4 - RegExp.$1.length));
      for(var k in o)if(new RegExp("("+ k +")").test(format))
        format = format.replace(RegExp.$1,
          RegExp.$1.length==1 ? o[k] :
            ("00"+ o[k]).substr((""+ o[k]).length));
      return format;
    }
    alert(new Date().format("yyyy-MM-dd hh:mm:ss"));

60、原生JavaScript時間個性化輸出功能

    /*
    1、< 60s, 顯示為「剛剛」
    2、>= 1min && < 60 min, 顯示與當前時間差「XX分鐘前」
    3、>= 60min && < 1day, 顯示與當前時間差「今天 XX:XX」
    4、>= 1day && < 1year, 顯示日期「XX月XX日 XX:XX」
    5、>= 1year, 顯示具體日期「XXXX年XX月XX日 XX:XX」
    */
    function timeFormat(time){
      var date = new Date(time)
        , curDate = new Date()
        , year = date.getFullYear()
        , month = date.getMonth() + 1
        , day = date.getDate()
        , hour = date.getHours()
        , minute = date.getMinutes()
        , curYear = curDate.getFullYear()
        , curHour = curDate.getHours()
        , timeStr;
     
      if(year < curYear){
        timeStr = year +'年'+ month +'月'+ day +'日 '+ hour +':'+ minute;
      }else{
        var pastTime = curDate - date
          , pastH = pastTime/3600000;
     
        if(pastH > curHour){
          timeStr = month +'月'+ day +'日 '+ hour +':'+ minute;
        }else if(pastH >= 1){
          timeStr = '今天 ' + hour +':'+ minute +'分';
        }else{
          var pastM = curDate.getMinutes() - minute;
          if(pastM > 1){
            timeStr = pastM +'分鐘前';
          }else{
            timeStr = '剛剛';
          }
        }
      }
      return timeStr;
    }

61、原生JavaScript解決offsetX兼容性問題

    // 針對火狐不支持offsetX/Y
    function getOffset(e){
      var target = e.target, // 當前觸發的目標對像
          eventCoord,
          pageCoord,
          offsetCoord;
     
      // 計算當前觸發元素到文檔的距離
      pageCoord = getPageCoord(target);
     
      // 計算光標到文檔的距離
      eventCoord = {
        X : window.pageXOffset + e.clientX,
        Y : window.pageYOffset + e.clientY
      };
     
      // 相減獲取光標到第一個定位的父元素的坐標
      offsetCoord = {
        X : eventCoord.X - pageCoord.X,
        Y : eventCoord.Y - pageCoord.Y
      };
      return offsetCoord;
    }
     
    function getPageCoord(element){
      var coord = { X : 0, Y : 0 };
      // 計算從當前觸發元素到根節點為止,
      // 各級 offsetParent 元素的 offsetLeft 或 offsetTop 值之和
      while (element){
        coord.X += element.offsetLeft;
        coord.Y += element.offsetTop;
        element = element.offsetParent;
      }

      return coord;
    }

62、原生JavaScript常用的正則表達式

    //正整數
    /^[0-9]*[1-9][0-9]*$/;
    //負整數
    /^-[0-9]*[1-9][0-9]*$/;
    //正浮點數
    /^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$/;  
    //負浮點數
    /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/;
    //浮點數
    /^(-?\d+)(\.\d+)?$/;
    //email地址
    /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/;
    //url地址
    /^[a-zA-z]+://(\w+(-\w+)*)(\.(\w+(-\w+)*))*(\?\S*)?$/;
    //年/月/日(年-月-日、年.月.日)
    /^(19|20)\d\d[- /.](0[1-9]|1[012])[- /.](0[1-9]|[12][0-9]|3[01])$/;
    //匹配中文字符
    /[\u4e00-\u9fa5]/;
    //匹配帳號是否合法(字母開頭,允許5-10字節,允許字母數字下劃線)
    /^[a-zA-Z][a-zA-Z0-9_]{4,9}$/;
    //匹配空白行的正則表達式
    /\n\s*\r/;
    //匹配中國郵政編碼
    /[1-9]\d{5}(?!\d)/;
    //匹配身份證
    /\d{15}|\d{18}/;
    //匹配國內電話號碼
    /(\d{3}-|\d{4}-)?(\d{8}|\d{7})?/;
    //匹配IP地址
    /((2[0-4]\d|25[0-5]|[01]?\d\d?)\.){3}(2[0-4]\d|25[0-5]|[01]?\d\d?)/;
    //匹配首尾空白字符的正則表達式
    /^\s*|\s*$/;
    //匹配HTML標記的正則表達式
    < (\S*?)[^>]*>.*?|< .*? />;

63、原生JavaScript實現返回頂部的通用方法

    function backTop(btnId) {
            var btn = document.getElementById(btnId);
            var d = document.documentElement;
            var b = document.body;
            window.onscroll = set;
            btn.style.display = "none";
            btn.onclick = function() {
                    btn.style.display = "none";
                    window.onscroll = null;
                    this.timer = setInterval(function() {
                            d.scrollTop -= Math.ceil((d.scrollTop + b.scrollTop) * 0.1);
                            b.scrollTop -= Math.ceil((d.scrollTop + b.scrollTop) * 0.1);
                            if ((d.scrollTop + b.scrollTop) == 0) clearInterval(btn.timer, window.onscroll = set);
                    },
                    10);
            };
            function set() {
                    btn.style.display = (d.scrollTop + b.scrollTop > 100) ? 'block': "none"
            }
    };
    backTop('goTop');

64、原生JavaScript獲得URL中GET參數值

    // 用法:如果地址是 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;i<GETs.length;i++){
          tmp_arr = GETs.split("=")
          key=tmp_arr[0]
          GET[key] = tmp_arr[1]
        }
      }
      return querystr[1];
    }

65、原生JavaScript實現全選通用方法

    function checkall(form, prefix, checkall) {
            var checkall = checkall ? checkall : 'chkall';
            for(var i = 0; i < form.elements.length; i++) {
                    var e = form.elements;
                    if(e.type=="checkbox"){
                            e.checked = form.elements[checkall].checked;
                    }
            }
    }

66、原生JavaScript實現全部取消選擇通用方法

    function uncheckAll(form) {
            for (var i=0;i<form.elements.length;i++){
                    var e = form.elements;
                    if (e.name != 'chkall')
                    e.checked=!e.checked;
            }
    }

67、原生JavaScript實現打開一個窗體通用方法

    function openWindow(url,windowName,width,height){
        var x = parseInt(screen.width / 2.0) - (width / 2.0);
        var y = parseInt(screen.height / 2.0) - (height / 2.0);
        var isMSIE= (navigator.appName == "Microsoft Internet Explorer");
        if (isMSIE) {
                var p = "resizable=1,location=no,scrollbars=no,width=";
                p = p+width;
                p = p+",height=";
                p = p+height;
                p = p+",left=";
                p = p+x;
                p = p+",top=";
                p = p+y;
            retval = window.open(url, windowName, p);
        } else {
            var win = window.open(url, "ZyiisPopup", "top=" + y + ",left=" + x + ",scrollbars=" + scrollbars + ",dialog=yes,modal=yes,width=" + width + ",height=" + height + ",resizable=no" );
            eval("try { win.resizeTo(width, height); } catch(e) { }");
            win.focus();
        }
    }

68、原生JavaScript判斷是否為客戶端設備

    function client(o){       
           var b = navigator.userAgent.toLowerCase();  
               var t = false;
               if (o == 'isOP'){
                             t = b.indexOf('opera') > -1;
               }
               if (o == 'isIE'){
                             t = b.indexOf('msie') > -1;
               }
               if (o == 'isFF'){
                             t = b.indexOf('firefox') > -1;
               }
           return t;
    }

69、原生JavaScript獲取單選按鈕的值

    function get_radio_value(field){
            if(field&&field.length){       
                    for(var i=0;i<field.length;i++){               
                            if(field.checked){                       
                                    return field.value;                                                               
                            }                       
                    }               
            }else {               
                    return ;                               
            }       
    }

70、原生JavaScript獲取復選框的值

    function get_checkbox_value(field){       
            if(field&&field.length){       
                    for(var i=0;i<field.length;i++){                       
                            if(field.checked && !field.disabled){
                                    return field.value;
                            }
                    }               
            }else {
                    return;
            }                       
    }

from http://developer.51cto.com/art/201312/425414.htm
Free Web Hosting