分享原生JavaScript技巧大收集(61~70)

浏览:1029 发布日期:2013/08/16 分类:前端开发 关键字: javascript js技巧 js代码片段
.
文章来源:jquery教程 - http://www.jq-school.com/Show.aspx?id=308
.
最近边写jquery代码,边搜集一些常用、实用的原生javascript实用代码片段,不知不觉又整理了70多个了,希望对大家有帮助,会不断的增加的,大家继续关注哦。。。

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;
        }                        
}
最佳答案
评论( 相关
后面还有条评论,点击查看>>