博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
解决浏览器兼容性的办法
阅读量:4312 次
发布时间:2019-06-06

本文共 1877 字,大约阅读时间需要 6 分钟。

1.清除浮动的兼容性:

                     清除浮动在低版本浏览器不可以使用,需要处理兼容性加一个

         .clearfix{*zoom:1;}

 

2.rgb rgbaopacity的兼容性:

                   rgb  和 opacity在ie低版本中不支持,需要加一个filter:                                            alpha(opacity=50);

 

3.解决css3中的兼容性

          chrome(谷歌)的前缀-webkit-

          firefox(火狐)的前缀-moz-

          ie的前缀 -ms-

          poera(欧朋)的前缀-o-

国内的浏览器的内核都是谷歌

 

 

4.  js解决兼容性

    1.ie6不支持document.documentElement,

         兼容写法:var w=document.documentElement.clientWidth||document.body.clientWidth

获取浏览器可见去的宽度

    2.ie6-8不支持getComputedStyle()这个方法,ie的是用currentStyle

 

 

Js解决兼容的方法

 

     3.元素.childNodes  这个属性有兼容性 标准浏览器会获取到文本节点

 

     而低版本浏览器不会。所以建议使用children这个属性

  4.标准下 元素.firstElementChild

    非标准下 元素.firstChild

    兼容下写法

          var list=document.getElementById("list")

          var fist=list.firstElementChild||list.firstChild

5.兼容性

      元素没有子节点,ie低版本不会读取不到,而标准浏览器会

     因为标准浏览器会把文本节点当作子节点,而ie6-8不会

. js解决兼容的方法

  1. ||

 

Var dd=document.documentElement.clientWidth||document.body.clientWidth

 

  1. if()else{}

 

if(window.getComputedStyle){

 

csss=window.getComputedStyle(aa,null)

 

}else{

 

csss=aa.currentStyle

 

}

 

console.log(csss)

6.获取浏览器的body属性是有兼容性的

var dd=document.body||document.documentElement

获取body的整个文档的高

    document.body.scrollHeight||documentElement.scrollHeight

获取浏览器一屏幕的高(浏览器的可视区)

document.body.clientHeight||document.documentElement.clientHeight

7.event的兼容性

    在Chrome下event是undefined在ie低版本下是null,火狐下会报错

document.οnclick=function(e){

var e=e||window.event

}

8.事件绑定的兼容性

  标准浏览器用addEventListener()这个方法

  ie低版本用attachEvent()这个方法

9.mouseevent有兼容性

  标准浏览器可以直接读取,但是ie不行

       解决办法

       

10.event对象的兼容性

        clientX和clientY是浏览器窗口左上角的距离坐标

        pageX和pageY是鼠标到网页左上角的距离坐标,但是ie低版本没有这个属性

        在ie下用clientY+scrollTop算pageY的值

11.事件源  点击那个元素,那个元素就是事件源

            标准浏览器的事件源是ev.target

            ie6-8没有这个属性    但是ie有ev.srcElement

12.阻止事件冒泡兼容性

    1.event.cancelBuble=true

              2.event.stopPropagation?event.stopPropagation():event.cancelBubble=true

13.阻止事件默认行为兼容性

  比如 ahref

  Href为空 会自动刷新页面

  Href# 锚点跳转

  Hrefjavascript:;阻止默认行为的发生

  Event.preventDefault?Event.preventDefault():event.returnValue=false

 

转载于:https://www.cnblogs.com/jiangningjn/p/9720851.html

你可能感兴趣的文章
ionic2 native app 更新用户头像暨文件操作
查看>>
SQL Server R2 地图报表制作(一)
查看>>
ZeroMQ——一个轻量级的消息通信组件
查看>>
JavaScript中数组和json的复制
查看>>
C语言多线程编程二
查看>>
转载:从集群计算到云计算
查看>>
服务器文件管理
查看>>
作业2
查看>>
ios上架报错90080,90087,90209,90125 解决办法
查看>>
给button添加UAC的小盾牌图标
查看>>
如何退出 vim
查看>>
Robberies
查看>>
get post 提交
查看>>
R安装
查看>>
跟我一起学C++
查看>>
Android自动化测试之环境搭建
查看>>
JavaScript运算符
查看>>
html position布局
查看>>
VTP
查看>>
Linux内核分析第一周——计算机是如何工作的
查看>>