获取元素的非行间样式

function getStyle(obj, name) { //获取元素的非行间样式
    if (obj.currentStyle) {
        return obj.currentStyle[name]; //ie
    } else {
        return getComputedStyle(obj, false)[name]; //ff chrome
    }
}

绑定事件

这种方式添加事件IE6/7/8只支持window.event不支持参数传入,
Firefox只支持参数传入不支持其它方式。
IE9/Opera/Safari/Chrome 两种方式都支持。
function myAddEvent(obj, ev, fn) { //绑定事件的兼容写法
    if (obj.attachEvent) {
        obj.attachEvent('on' + ev, fn); //ie
    } else {
        obj.addEventListener(ev, fn, false); //firefox chrome
    }
}

移除事件

function removeEvent(obj, ev, fn) { //移除事件的兼容写法
    if (obj.detachEvent) {
        obj.detachEvent('on' + ev, fn); //ie
    } else {
        removeEventListener(ev, fn, false); //firefox chrome
    }
}

阻止事件冒泡

function stopPropagation(e) { //阻止事件冒泡
    e = e || window.event;
    if (window.event) {
        e.cancelBubble = true; //ie
    } else {
        e.stopPropagation(); //firefox
    }
}

事件源

oUl.onmouseout = function(ev) {
       var ev = ev || window.event;  // 标准浏览器用ev,ie9以下用window.event
       var target = ev.target || ev.srcElement;  //标准浏览器用ev.target  ie浏览器用ev.srcElement

        if (target.nodeName.toLowerCase() == "li") {
              target.style.background = "";
       }
}

阻止浏览器默认行为

function stopDefault(e) {

    if (e && e.preventDefault) e.preventDefault();  //阻止默认浏览器动作(W3C)

    else window.event.returnValue = false;   //IE中阻止函数器默认动作的方式

    return false;

}

原生js的兼容问题总结的更多相关文章

  1. 原生JS编写兼容IE6,7,8浏览器无缝自动轮播(带按钮切换)

    项目要求页面兼容IE6,7,8等浏览器,我们可能会遇到这个轮播效果,轮播板块要求:无限循环.自动轮播和手动切换功能,每一次滚动一小格,网上有很多这类插件,例如:swiper等! 但是很多都是不兼容IE ...

  2. 前端开发必备组件库【基于原生js、兼容主流浏览器、B/S必备】

    [持续更新中...跪求点击右上角星星,好人一生平安!] API详见github,链接如下: https://github.com/pomelott/pomelo-plug-in

  3. 基于原生js的返回顶部组件,兼容主流浏览器

    基于原生js的返回顶部插件,兼容IE8及以上.FF.chrome等主流浏览器. js文件中封装了getScrollTop()和changeScrollTop()函数分别用于获取滚动条滚动的高度和修改滚 ...

  4. 原生JS forEach()和map()遍历的区别以及兼容写法

    一.原生JS forEach()和map()遍历 共同点: 1.都是循环遍历数组中的每一项. 2.forEach() 和 map() 里面每一次执行匿名函数都支持3个参数:数组中的当前项item,当前 ...

  5. 原生js实现ajax跨域(兼容IE8,IE9)

    html设置meta标签兼容360兼容模式和IE怪异模式 <meta http-equiv="X-UA-Compatible" content="IE=9;IE=8 ...

  6. 用原生JS实现多张图片上传及预览功能(兼容IE8)

    最近需要做一个图片上传预览的功能(兼容IE8-11.chrome.firefox等浏览器),网上现有的文件上传组件(如webuploader)总是会遇到一些兼容性问题.于是我参考了一些博文(链接找不到 ...

  7. 用原生JS写一个网页版的2048小游戏(兼容移动端)

    这个游戏JS部分全都是用原生JS代码写的,加有少量的CSS3动画,并简单的兼容了一下移动端. 先看一下在线的demo:https://yuan-yiming.github.io/2048-online ...

  8. 兼容各版本浏览器,封装原生Js获取ClassName

    web前端开发工作中常常会用到获取元素的className,用jQuery的$(".class")方法也可以获取className,但是有时候牵扯到数据而影响的加载顺序的原因会获取 ...

  9. 黄聪:原生js的音频播放器,兼容pc端和移动端(原创)

    更新时间:2018/9/3 下午1:32:54 更新说明:添加音乐的loop设置和ended事件监听 loop为ture的时候不执行ended事件 1 2 3 4 5 6 7 8 9 10 11 12 ...

随机推荐

  1. jquery实现公告上下滚动显示

    js: // JavaScript Documentfunction b(){ t = parseInt(x.css('top')); y.css('top','19px'); x.animate({ ...

  2. maven工程-eclipse红叹号

    从公司代码库中check下一份完整代码,在其他开发机器上都能正确构建,唯独一台机器无法正确构建,查证了2个小时,最后还是死在了最基础的问题上 maven工程 工程如下,创建了一个新的maven工程,j ...

  3. visual studio 2015提示IE10未安装

    将以下代码写入文本: @ECHO OFF :IE10HACK REG ADD "HKLM\SOFTWARE\Wow6432Node\Microsoft\Internet Explorer&q ...

  4. [GIF] GIF Loop Coder - Animating with Arrays

    In this lesson, we discuss animating using arrays, and how different data types are interpolated whi ...

  5. Java的递归算法

    递归算法设计的基本思想是:对于一个复杂的问题,把原问题分解为若干个相对简单类同的子问题,继续下去直到子问题简单到可以直接求解,也就是说到了递推的出口,这样原问题就有递推得解. 关键要抓住的是: (1) ...

  6. Eclipse错误

    1.java compiler level does not match the version of the installed java project facet 解决:http://blog. ...

  7. mysql sqlmap 注入尝试

    假设注入点为 http://www.abc.com/news.php?id=12 //探测数据库信息 sqlmap -u http://www.abc.com/news.php?id=12 –dbs ...

  8. php插件机制实现原理

    插件,亦即Plug-in,是指一类特定的功能模块(通常由第三方开发者实现) 它的特点: 1. 随时安装.卸载.激活.禁用 2. 无论什么状态都不影响系统核心模块的运行, 3. 是一种非侵入式的模块化设 ...

  9. 多版本uboot命令行分析

    1.1.6 经典版本: 1.uboot第二阶段第一个函数void start_armboot (void),一路gd参数设置.设备初始化.控制台初始化.端口初始化,最后到main_loop ()命令行 ...

  10. layer.js子窗口关闭并传数据到父窗的方法

    昨晚整了很晚,一直找不到方法.去官网api看了好久,又在网上搜了很久 始终找不到答案.今天自己终于找到了方法. 难点:因为 确认和取消按钮都是在父窗 调用js生成的按钮.只能从父窗回调的时候去去数据并 ...