一、浏览器卷去的高度和宽度

var scrollTop = document.documentElement.scrollTop || document.body.scrollTop
var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft

二、处理事件对象兼容

事件对象：当一个事件触发的时候，对本次事件的描述
如何获取事件对象

1. 标准浏览器

标准浏览器
直接在事件处理函数上接收一个形参
会在事件触发的时候, 由浏览器自动传递实参

2. IE低版本

IE 低版本
        不需要接收形参
        直接使用 window.event
        在标准浏览器下也可以使用
        官方给的还是兼容

3. 兼容

e = e || window.event

function (e) {e = e || window.event
}

三、处理事件目标兼容

目标
准确触发事件的那个元素
在事件对象里面有一个属性叫做 target
        表示本次事件触发的时候，准确触发的元素
        我们叫做事件目标
IE低版本不支持
        IE低版本使用 srcElement

处理兼容
var target = e.target || e.srcElement

四、按键兼容

事件对象里面有一个叫做 keyCode 的属性
表示你按下的是哪一个按键，但是是以编码的形式给你
特性： FireFox < 20的版本不支持
火狐低版本使用 which 属性
兼容：
var code = e.keyCode || e.which

五、阻止事件传播的兼容

标准浏览器： e.stopPropagation()
IE低版本： ecacelBubble = true
兼容：
方式1：if (e.stopPropagation) { } else { }
方式2： try {} catch (e) { } （尝试第一个大括号里面的代码，如果报错，执行后面的）

六、阻止浏览器默认行为的兼容

标准浏览器： e.preventDefault()
IE 低版本： e.returnValue = false

兼容：
       方式1： if (e.preventDefault) {} else {}
       方式2： try {} catch (err) {}
       方式3： return false （大部分情况下是可以用的）

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title>
</head>
<body><a href="https://www.baidu.com">阻止浏览器默认行为</a><script>// 获取元素var a = document.getElementsByTagName('a')[0]a.onclick = function (e) {e = e || window.eventconsole.log('我被点击了')// 阻止默认事件// e.preventDefault()// IE 低版本// e.returnValue = falsereturn false}//禁止框选文本window.onselectstart = function () {return false}// 右键单击事件window.oncontextmenu = function () {console.log('右键单击了')return false}</script>
</body>
</html>

JS中常见的兼容写法相关推荐

Python 中常见的配置文件写法
相信学习Python或者正在进行Python工作的小伙伴都会有一个疑问,为什么要写配置文件呢?在开发过程中,我们常常会用到一些固定参数或者是常量.对于这些较为固定且常用到的部分,往往会将其写到一个固定 ...
Python中常见的配置文件写法分享！
相信学习Python或者正在进行Python工作的小伙伴都会有一个疑问,为什么要写配置文件呢?在开发过程中,我们常常会用到一些固定参数或者是常量.对于这些较为固定且常用到的部分,往往会将其写到一个固定 ...
五大主流浏览器的内核，前端在IE浏览器中常见的兼容问题
一标题五大主流浏览器及其内核 1.Trident 代表作:IE 元老级内核之一,由微软开发,并于1997年10月首次在ie 4.0中使用,凭借其windows垄断优势, Trident市场占有率一直 ...
浅谈JS中常见的问题（三）
往期文章目录浅谈JS中常见的问题(一) 浅谈JS中常见的问题(二) JS知识总结往期文章目录前言 11. 同步和异步的区别 12. JS 判断变量类型的几种方法 13. 如何阻止事件冒泡与默认事 ...
JS中常见的String方法
对于JS中的字符串(String)我们经常使用,今天总结了一下常见的String方法. 1. length 检测字符串的长度 let str = 'abcdef';console.log(str.le ...
JS中常见的内存泄漏及识别方式
JavaScript常见的内存泄漏及识别方式 1.什么是内存 2.什么是内存泄漏 3.内存泄漏导致的后果 4.常见的内存泄漏 (1)全局变量引起的内存泄漏 (2)闭包引起的内存泄漏 (3)被遗忘的定时 ...
Vue中foreach数组与js中遍历数组的写法
场景 Vue中使用Axios发送get或者post请求,发送请求时需要在js中对请求参数进行遍历并处理. 接收响应时需要对响应结果进行遍历和处理. 注意区分在vue和js中foreach数组的区别. ...
js数组获取index_通过事例重温一下 JS 中常见的15 种数组操作(备忘清单)，收藏...
数组是 JS 中广泛使用的数据结构.数组对象提供了大量有用的方法,如array. forEach().array.map()等来操作数组. 在实战中,我经常对数组可能的操作和相应采用哪个更好的方法不知 ...
html事件中写js,html标签中绑定触发事件与js中绑定触发事件写法上的区别
html> js中方法名后加括号和不加口号的区别按钮 var test = function(){ var span = document.createElement("span&q ...
JS中常见的字符串拼接处理
最近动态的编写界面的时候总是需要不定时的用到js,而字符串的拼接还有在jsp文件获取后台的数据变量是个使用的麻烦,我把我碰到的列举一下,希望对以后看到这个问题的人有所帮助 1. JS获取java后台在 ...

JS中常见的兼容写法

JS中常见的兼容写法

一、浏览器卷去的高度和宽度

二、处理事件对象兼容

1. 标准浏览器

2. IE低版本

3. 兼容

三、处理事件目标兼容

四、按键兼容

五、阻止事件传播的兼容

六、阻止浏览器默认行为的兼容

JS中常见的兼容写法相关推荐

最新文章

热门文章

JS中常见的兼容写法

JS中常见的兼容写法

一、浏览器卷去的高度和宽度

二、处理事件对象兼容

1. 标准浏览器

2. IE低版本

3. 兼容

三、处理事件目标兼容

四、 按键兼容

五、阻止事件传播的兼容

六、 阻止浏览器默认行为的兼容

JS中常见的兼容写法相关推荐

最新文章

热门文章

四、按键兼容

六、阻止浏览器默认行为的兼容