在 样式布局分享-基于frozen.js的移动OA 文章中,用了到第三方组件 tab.js(带菜单的横屏滑动插件),其兼容性很差,进行优化后,已兼容全平台(且支持IE6+). tab.js GitHub Clone 地址 一直听说过IE6~IE9浏览器的兼容性问题是深坑,这次终于有所体会,就本次优化tab.js而言,如果不对IE6~IE9进行兼容,工作量可以减少一倍. 特此把遇到的各种浏览器兼容性问题进行汇总,希望对大家有所帮助. trim(不支持IE6~IE9) 说明:去掉字符串中的空格. /…

转自:蓝色理想 以下以 IE 代替 Internet Explorer,以 MF 代替 Mozilla FF 一.函数和方法差异 1. getYear()方法 [分析说明]先看一下以下代码: var year=new Date().getYear(); document.write(year); 在IE中得到的日期是"2010",在Firefox中看到的日期是"110",主要是因为在 Firefox 里面 getYear 返回的是 "当前年份-1900&q…

1.添加事件方法 addHandler:function(element,type,handler){ if(element.addEventListener){//检测是否为DOM2级方法 element.addEventListener(type, handler, false); }else if (element.attachEvent){//检测是否为IE级方法 element.attachEvent("on" + type, handler); } else {//检测是否…

此文复现的所有兼容性问题均为以下情况: 1. 腾讯X5内核 2. 全屏webview 问题如下: 1. IOS12 中软键盘弹出导致页面顶部截断,并且无法恢复. 解决方法:添加交互事件,调用本地方法,在键盘收起后执行页面回滚操作. bridgeClass.jsEventHook.keyboardWillShow = function () { // 添加flag 是因为 有多个空时,切换输入框也会调用WillHide switchFlag = true; }; bridgeClass.jsEve…

ECMA Script5中数组方法如indexOf().forEach().map().filter().some()并不支持IE6-8,但是国内依然有一大部分用户使用IE6-8,而以上数组方法又确实非常好用.在过去,我会为了兼容性尽量不用这些方法.但是,总不能为了旧的丢了新的吧?!虽然说jQuery已经集成好了不少语法糖,但jQuery体积太庞大,作为一名志于体面的前端儿得知道原生的兼容性写法要怎么写.于是这几天,我开始在琢磨这些方法的兼容性写法.其实并不难,就是以前不够自信不敢写.写完以后,…

1.eval函数 <script type="text/javascript"> //eval的兼容性 var s="function(){alert('test')}"; var fn=eval('('+s+')'); fn(); </script> 这行代码在chorme运行正常,但是在ie中报错,找不到对象 解决办法:如下 <script type="text/javascript"> //eval的兼容…

一.属性相关 我们通常把特征(attribute)和属性(property)统称为属性,但是他们确实是不同的概念, 特征(attribute)会表现在HTML文本中,对特征的修改一定会表现在元素的outerHTML中,并且特征只存在于元素节点中: 属性(property)是对于JS对象进行修改,除了浏览器内置的部分特征外,其它的属性操作并不会影响HTML文本. IE6/7不区分属性和特征 其它浏览器会区分属性和特征,而IE67并不会区分它们,在IE67下我们只能用属性名来删除特征,虽然这两个名字…

问题:IE8/9不支持Array.indexOf 解决方案 if (!Array.prototype.indexOf) { Array.prototype.indexOf = function(elt /*, from*/) { var len = this.length >>> 0; var from = Number(arguments[1]) || 0; from = (from < 0) ? Math.ceil(from) : Math.floor(from); if (f…

1,伪元素:first-child不起作用,需要单独指定样式名称 2,透明度表示方法,尤其在函数中表示 @mixin opacity($value) { -webkit-opacity: $value; -moz-opacity: $value; -ms-opacity: $value; -o-opacity: $value; filter: alpha(opacity=$value*100); //0~100的,所以这里需要*100 opacity: $value; } 3,input文字垂直…

1.IE6的双边距BUG. 发生条件:如果有元素是浮动元素,则该元素与它的父元素(一般是一个容器)直接相接触(中间不能隔着其他元素)的左或右的边距就会产生双倍边距,也意味着相邻的兄弟元素不可能会产生双倍边距,只有元素与其父元素之间才有可能产生双倍边距,产生双倍边距的那边是与其父元素相接触的那边 解决方法:给产生双倍边距的元素添加上 display:inline. (上面的发生条件有点问题,一般是:    一个div盒子如果设置了margin,并且该div设置了float浮动,那么在IE6下便会产…