javascript原生代码中经常会遇到各式各样浏览器不兼容的问题,浏览器真是倔强,解决浏览器的兼容是前端猿们的一大难题

为了避免在工作中遇到这些简单的问题。节约开发时间,在这里总结一些常用的浏览器兼容原生js的一些问题

1.获取事件对象

e=e||window.event;

2.获取键码的通用代码

var keyCode = e.keyCode || e.which || e.charCode

3.获取页面滚动距离

var top = document.body.scrollTop | document.documentElement.scrollTop;

4.ajax获取xmlhttp对象

if(window.XMLHttpRequest)
{
var oAjax=new XMLHttpRequest();//标准浏览器
}
else
{
var oAjax=new ActiveXObject("Microsoft.XMLHTTP");//IE低版本
}

6.取消默认事件

document.addEventListener('contextmenu',function(ev){
ev.preventDefault();
}))
document.oncontextmenu = function(){
return false;
}

7.事件绑定

a.addEventListener("click",function(){
//其他主流浏览器的事件绑定
}); 
a.attachEvent("onclick",function(){
//Ie浏览器的事件绑定
});

8.获取事件对象目标

getTarget: function(event){
return event.target || event.srcElement;
}

9.阻止事件冒泡的方法

stopPropagation: function(event){
if (event.stopPropagation){
event.stopPropagation();
} else {
event.cancelBubble = true;
}
}

10.访问剪贴板中的数据

getClipboardText: function(event){
var clipboardData = (event.clipboardData || window.clipboardData);
return clipboardData.getData("text");
}

11.设置剪贴板中的数据

setClipboardText: function(event, value){
if (event.clipboardData){
return event.clipboardData.setData("text/plain", value);
} else if (window.clipboardData){
return window.clipboardData.setData("text", value);
}
}

12.对象的深度复制

function deepClone(obj){
var o = obj instanceof Array ? [] : {};
for(var k in obj)
o[k] = typeof obj[k] === Object ? deepClone(obj[k]) : obj[k];
return o;
}

  

未完待续。。。。。。。。。。

js的兼容技巧的更多相关文章

  1. JS处理事件小技巧

    今天,就分享一下我自己总结的一些JS的小技巧: ①防止鼠标选中事件 <div class="mask" onselectstart="return false&qu ...

  2. 设为首页 和 收藏本站js代码 兼容IE,chrome,ff

    设为首页 和 收藏本站js代码 兼容IE,chrome,ff //设为首页 function SetHome(obj,url){ try{ obj.style.behavior='url(#defau ...

  3. 关于js的兼容问题(小办法)!

    今天整理了一下浏览器对JS的兼容问题,希望能给你们带来帮助,我没想到的地方请留言给我,我再加上: 常遇到的关于浏览器的宽高问题: //以下均可console.log()实验 var winW=docu ...

  4. js基础 - 兼容代码

    js基础 - 兼容代码 . scrollTop . chrome document.body.scrollTop . IE && firefox document.documentEl ...

  5. 图片旋转+剪裁js插件(兼容各浏览器) « 张鑫旭-鑫空间-鑫生活

    图片旋转+剪裁js插件(兼容各浏览器) « 张鑫旭-鑫空间-鑫生活 图片旋转+剪裁js插件(兼容各浏览器) by zhangxinxu from http://www.zhangxinxu.com 本 ...

  6. JS 一些常用技巧

    记录 JS 常用的技巧 1. 生成随机数 2. 解决浮点数问题 3. 无路可走时,看看是不是 事件 冒泡了...

  7. Chrome JS断点调试技巧

    Chrome调试折腾记_(2)JS断点调试技巧 技巧一:格式化压缩代码 技巧二:快速跳转到某个断点的位置 技巧三:查看断点内部的作用范围[很实用] 技巧4:监听事件断点 技巧5:DOM及 XHR监听跳 ...

  8. 14条最佳JS代码编写技巧

    http://gaohaixian.blog.163.com/blog/static/123260105201142645458315/写任何编程代码,不同的开发者都会有不同的见解.但参考一下总是好的 ...

  9. JS播放声音 兼容所有浏览器

    JS播放声音 兼容所有浏览器 <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http ...

随机推荐

  1. css中display的属性解析

    display 属性规定元素应该生成的框的类型. 他有很多属性值,见如下表格: none 此元素不会被显示. block 此元素将显示为块级元素,此元素前后会带有换行符. inline 默认.此元素会 ...

  2. 三角形(Triangle)

    三角形(Triangle) 问题 给出一个三角形,找出从顶部至底部的最小路径和.每一步你只能移动到下一行的邻接数字. 例如,给出如下三角形: [ [2], [3,4], [6,5,7], [4,1,8 ...

  3. 机器学习的Spark与Scala开发简介

     一.机器学习常用开发软件:Spark.Scala 1. Spark简介: MLlib包含的库文件有: 分类 降维 回归 聚类 推荐系统 自然语言处理 在线学习 统计学习方法:偏向理论性,数理统计的方 ...

  4. cocos2d-x protobuf; cocos2dx protocol buffer

    昨天了解到项目要用到protocol buffer,今天晚上看了一下,了解protobuf本质上就是一个信息表达协议+编辑,解析库. linux开源软件都一个模式,先./configure --hel ...

  5. nginx+apache+mysql+php+memcache+squid搭建集群web环境

    服务器的大用户量的承载方案 一.前言 二.编译安装 三. 安装MySQL.memcache 四. 安装Apache.PHP.eAccelerator.php-memcache 五. 安装Squid 六 ...

  6. VB.NET调用SQL Sever存储过程

    概要: 本文介绍VB.NET使用创建并调用带有输入参数和输出参数的SQL Sever存储过程 本文代码首先检查要创建的存储过程再数据库中是否存在在.如果不存在,则代码创建一个存储过程,该过程一个参数来 ...

  7. java.sql.Types,数据库字段类型,java数据类型的对应关系

    以下转自:http://kummy.itpub.net/post/17165/172850 本文在原文基础上有增减. 本概述是从<JDBCTM Database Access from Java ...

  8. NET仿微信Oauth2.0

    这个文章先说一说Oauth2.0的原理,再到应用场景,最后才是代码实现,这样才学会最终的思想,并在应用场景使用,所谓实践出真理. 1,Oauth2.0的原理 OAuth是一个关于授权(authoriz ...

  9. 没有花括号(大括号)的for循环也能正确执行

    代码一 for循环没有{}大括号(花括号),在for语句下面是一条语句. for(var i=0;i<3;i++) console.log(1,i); 上面的代码能无误输出: 1 01 11 2 ...

  10. Bootstrap UI层收藏介绍

    Table组件使用的是bootstrap table,之所以用它是因为它的API比较全,并且博主觉得它的风格适用于各种类型的设备,无论是PC端还是手机端都都能很好的兼容各种浏览器.现将相关内容收藏如下 ...