js 浏览器兼容的一些方法

使用js是一件令人很抓狂的事情，很多的浏览器兼容，一大推的代码，谁的脑袋能记住那么多的东西，只有平时多积累，所谓熟能生巧嘛。。这里列出一些常用的兼容代码，一点点积累哈~~~

   

一、以跨浏览器的方式处理事件。这个叫EventUtil对象定义了一些方法，用来处理各浏览器之间的差异。

    

     var EventUtil={

        

         addHandler:function(element,type,handler){//绑定事件

             if(element.addEventListener){

                 element.addEventListener(type,handler,false);

             }else if(element.attachEvent){

                 element.attachEvent("on"+type,handler);

             }else{

                 element["on"+type]=null;

             }

         },

    

         removeHandler:function(element,type,handler){//取消事件

             if(element.removeEventListener){

                 element.removeEventListener(type,handler,false);

             }else if(element.detachEvent){

                 element.detachEvent("on"+type,handler);

             }else{

                 element["on"+type]=null;

             }

         },

        

         getEvent:function(event){//获取event对象

             return event:event?window.event;

         },

 

         getTarget:function(event){//获取事件目标

             return event.target||event.srcElement;

         },

 

         preventDefault:function(event){//阻止默认事件

             if(event.preventDefault){

                  event.preventDefault();

             }else{

                  event.returnValue=flase;

             }

         },

 

         stopPropagation:function(event){//阻止冒泡事件

             if(event.stopPropagation){

                  event.stopPropagation();

             }else{

                  event.cancelBubble=true;

             }

         },

 

         getRelatedTarget:function(event){//mouseover,mouseout通过event提供相关元素信息

             if(event.relatedTarget){

                 return event.relatedTarget;

             }else if(event.toElement){

                 return event.toElement;

             }else if(event.fromElement){

                 return event.fromElement;

             }else{

                 return null;

             }

         },

 

         getButton:function(event){//获取鼠标按下键位

             if(document.implementation.hasFeature("MouseEvents","2.0")){

                 return event.button;

             }else{

                 switch(event.button){

                     case 0:

                     case 1:

                     case 3:

                     case 5:

                     case 7:

                           return 0;

                     case 2:

                     case 6:

                           return 2;

                     case 4:

                           return 1;

                 }

             }

         },

 

         getCharCode:function(event){//键盘按下键的ascii值码

             if(typeof event.charCode=="number"){

                  return event.charCode;

             }else{

                  return event.keyCode;

             }

         },

 

         //clipboardData 剪贴板对象，firefox不支持该对象

         getClipboardData:function(event){//获取剪贴板数据

              var clipboardData=(event.clipboardData||window.clipboardData);

              return clipboardData.getData("text");

         },

        

         setClipboardData:function(event,value){

              if(event.clipboardData){

                  return event.clipboardData.setData("text/plain",value);

              }else if(window.clipboardData){

                  return window.clipboardData.setData("text",value);

              }

         },

     }

 

 

二、对表单的操作兼容的一些函数：

1、取得用户在文本框取得的文本：

      function getSelectedText(textbox){

           if(document.selection){//ie

                return document.selection.creatRange().text;

           }else{

                return textbox.value.substring(textbox.selectionStart,textbox.selectionEnd);

           }

      }

 

2、选择部分文本：

      function selectText(textbox,startIndex,stopIndex){

           if(textbox.setSelectionRange){

                 textbox.setSelectionRange(startIndex,stopIndex);

           }else if(textbox.createTextRange){//ie

                 var range=textbox.createTextRange();

                 range.collapse(true);

                 range.moveStart('character',startIndex);

                 range.moveEnd('character',stopIndex-startIndex);

                 range.select();

           }

           textbox.focus();

      }

 

三、一些常用的js自定义函数。

1、下面这个函数可以辅助向现有的URL的末尾添加查询字符串参数，查询字符串中的每个名称和值都应该用encodeURIComponent()进行编码，不然容易发生请求错误：

      function addURLParam(url,name,value){

           url+=(url.indexof('?')==-1?"?":"&");

           url+=encodeURIComponent(name)+"="+encodeURIComponent(value);

           return url;

      }

 

2、设置和获取cookie:

      var CookieUtil={

          get:function(name){

              var cookieName=encodeURIComponent(name)+"=",

                  cookieStart=document.cookie.indexof(cookieNmae);

                  cookieValue=null;

              if(cookieStart>-1){

                  var cookieEnd=document.cookie.indexof(";",cookieStart);

                  if(cookieEnd==-1){

                      cookieEnd=document.cookie.length;

                  }

                 cookieValue=decodeURIComponent(document.cookie.substring(cookieStart+cookieName.length,cookieEnd));

              }

              return cookieValue;

          },

         

          set:function(name,value,expires,path,domain,secure){

              var cookieText=encodeURIComponent(name)+"="+encodeURIComponent(value);

              if(expires instanceof Date){

                   cookieText+=";expires="+expires.toGMTString();

              }

              if(path){

                   cookieText+=";path="+path;

              }

              if(domain){

                   cookieText+=";domain="+domain;

              }

              if(secure){

                   cookieText+=";secure="+secure;

              }

              return cookieText;

          }

          unset:function(name,path,domain,secure){

              this.set(name,"",new Date(0),path,domain,secure);

          }

      }