web前端浏览器兼容难题及解决方法是什么-创新互联

web前端浏览器兼容难题及解决方法是什么，针对这个问题，这篇文章详细介绍了相对应的分析和解答，希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。

成都创新互联公司是一家集网站建设,通道企业网站建设,通道品牌网站建设,网站定制,通道网站建设报价,网络营销,网络优化,通道网站推广为一体的创新建站企业，帮助传统企业提升企业形象加强企业竞争力。可充分满足这一群体相比中小企业更为丰富、高端、多元的互联网需求。同时我们时刻保持专业、时尚、前沿，时刻以成就客户成长自我，坚持不断学习、思考、沉淀、净化自己，让我们为更多的企业打造出实用型网站。

在前端面试题中，最常见的就是遇到浏览器兼容的问题。比如面试题常常会这样问：工作中你都兼容哪些浏览器 ？ 实际开发中你都遇到过哪些兼容问题 ？下面小编就来为大家提供前端浏览器兼容难题的解决方法。

所谓的浏览器兼容性问题，是指因为不同的浏览器对同一段代码有不同的解析，造成页面显示效果不统一的情况。在大多数情况下，我们的需求是，无论用户用什么浏览器来查看我们的网站或者登陆我们的系统，都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题。当然啦关于浏览器兼容的这个问题太笼统了 所以当面试官问这个问题的时候，大家可以问一下面试官是指的是哪方面。

一、CSS里的兼容性问题　：

Input 的按钮在 ios 和 Android 中的样式兼容问题

ios 有默认的渲染 方式 渐变和圆角而且他的行高并不会随着内容的增加。

解决方法：

在标签上增加

-webkie-appearance：none； Height：4rem；

滚动穿透的问题:

滚动穿透是指在移动端当有 flxed 遮罩和弹出层的时候，屏幕上的滑动能够滑动背景下的内容。

最后的解决方法

body.modal-open{

postion:flxed;

width:100%;

二、js里面的兼容性问题

1.const问题

说明:Firefox下,可以使用const关键字或var关键字来定义常量;

IE下,只能使用var关键字来定义常量。

解决方法：统一使用var关键字来定义常量。

2.event.srcElement问题

说明：IE下，event对象有srcElement属性，但是没有target属性；Firefox下，even对象有target属性，但是没

有srcElement属性。

解决方法：使用srcObj =event.srcElement ?event.srcElement : event.target;

3.事件绑定

IE：dom.attachEvent();

其他浏览器：dom.addEventListener();

标准浏览器采用事件捕获的方式对应IE的事件冒泡机制（即标准由最外元素至最内元素或者IE由最内元素到最外元素）最后标准方亦觉得IE这方面的比较合理，所以便将事件冒泡纳入了标准，这也是addEventListener第三个参数的由来，而且事件冒泡作为了默认值。

4.ajax略有不同

IE:ActiveXObject

其他：xmlHttpReuest

关于web前端浏览器兼容难题及解决方法是什么问题的解答就分享到这里了，希望以上内容可以对大家有一定的帮助，如果你还有很多疑惑没有解开，可以关注创新互联行业资讯频道了解更多相关知识。

分享名称：web前端浏览器兼容难题及解决方法是什么-创新互联
文章地址：http://dzwzjz.com/article/cejdie.html