前端兼容性问题4——js关于事件的兼容性

最新推荐文章于 2024-03-03 16:30:00 发布
最新推荐文章于 2024-03-03 16:30:00 发布
阅读量129 收藏
点赞数 1
文章标签： html html5 css3
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_41571938/article/details/115872451
版权
本文主要探讨了前端开发中遇到的事件兼容性问题，特别是滚动事件的处理。在标准浏览器下，可以使用window.onscroll或document.onscroll，但IE6到8需要使用window。获取垂直滚动距离在不同浏览器间有所不同，Firefox支持document.documentElement.scrollTop，而Chrome和IE则使用document.body.scrollTop。此外，文章还介绍了取消默认行为的各种方法，包括return false、e.preventDefault()、e.returnValue = false以及在IE中与obj.setCapture()和obj.releaseCapture()配合使用的场景。
摘要由CSDN通过智能技术生成

6.滚动事件
a>滚动事件：onscroll
在标准浏览器下：window.onscroll或document.onscroll
ie6,7,8,认为document没有onscroll事件，使用尽量window
b>垂直方向滚动条滚动过的距离顶部的距离 ：scrollTop
火狐下获取页面scrollTop的距离：document.documentEelement.scrollTop （谷歌不支持）
谷歌和ie：document.body.scrollTop

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

7.取消默认行为
a> return false; 这个如果当函数有返回值的时候就不能再用了
b>标准浏览器下的方法：e.preventDefault();
c>ie内核下：e.returnValue = false;
d>ie如果在取消图片的默认行为的时候需要搭配 obj.setCap

最低0.47元/天 解锁文章
熊熊举高高
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
前端兼容性问题3——js关于事件的兼容性
weixin_41571938的博客
04-19 180
事件对象 事件对象： 当触发事件的时候会产生一个事件对象event ,这个事件对象中包含与这个事件有关的所有信息 a>ie和谷歌，在全局window下面，可以直接打印event相关的信息,输出是未定义（在没有事件发生的时候）, 有事件发生的时候会打印出关于这个事件的所有信息 b>火狐只支持以事件处理函数的第一个参数的形式,而ie6,7,8不支持以事件函数的第一个参数的形式，但不会报错 var oBox = document.getElementById('box'); oBox.onclic
前端js与css兼容性问题
q13262724268的博客
06-03 320
使用Trident内核的浏览器：IE、Maxthon、TT； 使用Gecko内核的浏览器：Netcape6及以上版本、FireFox； 使用Presto内核的浏览器：Opera7及以上版本； 使用Webkit内核的浏览器：Safari、Chrome。 javascript兼容性问题 在javascript中，各个浏览器基本语法差距不大，其兼容问题主要出现在各个浏览器的
JS中的兼容问题总结
weixin_30295091的博客
08-23 264
今天总结总结在JS里面遇到的兼容性问题 1.获取滚动距离的兼容性问题: document.documentElement.scrollTop || document.body.scrollTop （兼容IE） 2.获取非行间样式 getComputedStyle(元素,false)[attr] || 元素.currentStyle[attr] ...
关于前端js兼容性问题的积累
qq_40652539的博客
12-05 1008
1、event的兼容写法 (1) 实参不传入event 形参中无论是否接收event时，直接使用 event || window.event, 谷歌和ie正常，在火狐下会报event为undefined，需要在形参中接收event，并添加 arguments.callee.caller.arguments[0] 写发 (2) 实参传入event 形参接收event，可直接使用 event || w...
js中常见的浏览器兼容问题
cp3___的博客
05-10 945
总结一些常见的浏览器中的兼容问题 1、滚动条 document.documentElement.scrollTop||document.body.scrollTop 2、获取样式兼容 function getStyle(dom, styleName){ return dom.currentStyle? dom.currentStyle[styleName] :getComputed...
关于网页媒体播放器兼容性的问题（附原码） 下载
10-30
本文将围绕一个具体的案例——“关于网页媒体播放器兼容性的问题（附原码）”进行深入探讨，旨在解决多浏览器兼容性问题，并提供一些实用的解决方案。 #### 二、问题概述 本案例中的网页媒体播放器主要功能包括： ...
Bootstrap 3浏览器兼容性问题及解决方案
08-30
在本文中，我们将深入探讨Bootstrap 3的浏览器兼容性问题，并提供有效的解决方案。Bootstrap 3是一个流行的前端开发框架，主要用于创建响应式布局和移动优先的Web项目。由于其基于HTML、CSS和JavaScript，开发者可以...
JS的兼容性问题
09-30
然而，由于不同的浏览器对于JS的支持程度和解释方式存在差异，这就导致了一个棘手的问题——**兼容性问题**。本文将围绕这一主题进行深入探讨，帮助开发者更好地理解和解决实际开发中遇到的各种兼容性挑战。 #### ...
table自动拉伸在chrome与IE中的兼容性问题解决
09-25
在网页开发中，表格（table）布局经常遇到各种兼容性问题，尤其是在不同的浏览器之间。本文主要探讨了在Chrome和IE浏览器中，table自动拉伸时的兼容性差异，并提供了相应的解决方案。 首先，我们要理解问题的核心：...
React.Js添加与删除onScroll事件的方法详解
10-19
主要给大家介绍了关于React.Js添加与删除onScroll事件的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧。
JS高级拖动技术 setCapture，releaseCapture
12-12
代码如下: [removed] <!– [removed]=function(){ objDiv = document.getElementById(‘drag’); drag(objDiv); }; function drag(dv){ dv.onmousedown=function(e){ var d=document; e = e || window.event; var x= e.layerX || e.offsetX; var y= e.layerY || e.offsetY; //设置捕获范围 if(dv.setCapture){
js中的兼容问题汇总
09-08 132
在使用js的过程中,往往会发现关于IE浏览器的兼容问题,当然微软现在自己也打算抛弃IE,推出了edge浏览器,对于前端来说是个好消息. 但IE的用户占比仍然不容小觑,因此这里整理下常见的几个兼容问题附上解决方案,以免不时之需. 1.非行内样式的获取 　　IE浏览器:element.currentstyle+attr 　　正常浏览器(chrome,FF):getComputedSt...
JS常见的兼容性问题汇总
Calla_Lj的博客
04-26 3071
JS常见的兼容性问题 1） 滚动条： document.documentElement.scrollTop||document.body.scrollTop 获取样式兼容 function getStyle(dom, styleName){ return dom.currentStyle? dom.currentStyle[styleName] getComputedStyle(dom)[st...
一文搞懂前端兼容问题
hebiwen95的博客
08-18 374
对于大部分开发者来说，版本兼容是一件存在感很低的事情，因为它在绝大部分情况下都是一行配置，在一些前端工具链（例如 Babel、CoreJS，Autoprefixer 等工具）的帮助下适配到目标浏览器，只会在一些大的 break change 事件（例如 Vue3 必须在支持 Proxy 的现代浏览器下才能运行）下才会关注这件不起眼的事情。但当你稍微研究一下的时候，才会发现这块儿内容知识非常杂，因为版本兼容的相关知识没有那么多内在逻辑性，很多细碎的知识点散落在在各个商业公司的博弈和版本变更中。...
前端解决浏览器兼容问题合集（1）——事件兼容
weixin_42046203的博客
01-14 448
浏览器兼容（主要是ie浏览器）是前端最头疼的问题之一，接下来的文章我将整理各种兼容性问题解决办法。 这是第一篇文章，针对如何解决事件兼容问题，首先分析ie与其他浏览器的区别何在 一、事件处理程序 其他浏览器使用addEventListener()和 removeEventListener()实现处理指定和删除事件处理程序的操作 ie浏览器使用attachEvent()和 detachEvent()实现处理指定和删除事件处理程序的操作 兼容性写法： addHandler: function(e
前端开发中的浏览器兼容性问题及解决方案
最新发布
极限突破者的博客
03-03 6079
在之前的文章中，我们学习了前端开发中的网站性能提升的相关内容。在本文中，我们将深入探讨一个前端开发者必须面对的问题：浏览器兼容性问题。我们将介绍什么是浏览器兼容性问题，为什么会发生这种问题，以及如何解决这些问题。浏览器兼容性问题是指在不同的浏览器中，同一段代码可能会呈现出不同的效果，这对于前端开发者来说是一个头疼的问题。CSS兼容问题及解决方案JS兼容问题及解决方案移动端兼容问题及解决方案浏览器兼容性问题是前端开发中必须面对的问题，但是通过使用适当的解决方案，我们可以最大程度地减少这些问题的影响。
JS事件的兼容性，事件的闭包作用
Lvsiwei0719的博客
04-22 421
事件的兼容性 1.事件绑定与事件移除 事件绑定：（addEventListener）与事件移除（removeEventListener） E.addEventListener（type，处理程序，true/flase） E.removeEventListener（type，处理程序，true/flase） // 传统绑定事件的写法 获取元素，装进数组，for循环 arr_01[i].functio...
常见的几个JavaScript兼容问题及解决方案
weixin_47340917的博客
05-02 1153
常见的几个JavaScript兼容问题及解决方案 事件对象的兼容 e = ev || window.event; 滚动事件的兼容 scrollTop = document.documentElement.scrollTop || document.body.scrollTop; 阻止冒泡事件的兼容 if(e.stopPropagation){ e.stopPropagation(); }else{ e.cancelBubble = true; } 阻止浏览器默认行为的兼容
前端面试必备：WEB标准、语法要点与兼容性策略
Link方式通常优于@import，因为它在文档头部加载且无兼容性问题。 6. **CSS选择器与优先级**：选择器类型（标签选择器、类选择器、ID选择器）、CSS属性继承（如颜色、字体等可以继承）、优先级算法（如ID选择器最高...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值