当前位置:  编程技术>WEB前端

非常不错的关于IE与FireFox的js和css几处不同点[转自星火燎原]

    来源: 互联网  发布时间:2014-09-06

    本文导语:  在蓝色上看到这篇文章的,感觉作者总结的不错,至少有些偶自己也没有真正的认识过。这些 东西的确是应该好好总结一下的,可惜偶这人比较懒,收藏整理于此,便于自己学习! 1.firefox不能对innerText支持。 firefox支持innerHT...

在蓝色上看到这篇文章的,感觉作者总结的不错,至少有些偶自己也没有真正的认识过。这些 东西的确是应该好好总结一下的,可惜偶这人比较懒,收藏整理于此,便于自己学习!

1.firefox不能对innerText支持。
firefox支持innerHTML但却不支持innerText,它支持textContent来实现innerText,不过默认把多余的空格也保留了。如果不用textContent,如果字符串里面不包含HTML代码也可以用innerHTML代替。
2.禁止选取网页内容:
在IE中一般用js:obj.onselectstart=function(){return false;}
而firefox用CSS:-moz-user-select:none

3.滤镜的支持(例:透明滤镜):
IE:filter:alpha(opacity=10);
firefox:-moz-opacity:.10;

4.捕获事件:
IE:obj.setCapture() 、obj.releaseCapture()
Firefox: document.addEventListener("mousemove",mousemovefunction,true);
    document.removeEventListener("mousemove",mousemovefunction,true);

5.获取鼠标位置:
IE:event.clientX、event.clientY
firefox:需要事件函数传递事件对象
    obj.onmousemove=function(ev){
        X= ev.pageX;Y=ev.pageY;
    }

6.DIV等元素的边界问题:
比如:设置一个div的CSS::{width:100px;height:100px;border:#000000 1px solid;}
IE中:div的宽度(包括边框宽度):100px,div的高度(包括边框宽度):100px;
而firefox:div的宽度(包括边框宽度):102px,div的高度(包括边框宽度):102px;


所以在做这个兼容IE和firefox的拖动窗口时,在js和css的写法上要动点脑筋,给大家两个小技巧

一.判断浏览器类型:
var isIE=document.all? true:false;
我写了一个变量,如果支持document.all语法那么isIE=true,否则isIE=false

二.在不同浏览器下的CSS处理:
一般可以用!important来优先使用css语句(仅firefox支持)
比如:{border-width:0px!important;border-width:1px;}
在firefox下这个元素是没有边框的,在IE下边框宽度是1px


几处XHTML与正常状态下的JS、CSS的区别

在网页开头加了这个代码就是所谓的XHTML标准了

XHTML标准下的几个不同点:
1.document.documentElement 与 document.body
代码中设置页面的CSS时一定要用:document.documentElement 
比如:document.documentElement.style.overflow='hidden';
overflow-X、overflow-Y 这两个分坐标属性XHTML是不支持的;

2.在取得网页窗口区域和获取滚动条位移距离时也要用document.documentElement 
即这四个属性(clientWidth、clientHeight、scrollLeft、scrollTop)一定要用document.documentElement 
但是document.body.appendChild()和document.body.removeChild()却是可以用的,而且用document.documentElement.appendChild()和document.documentElement.removeChild()代替却会报错;

总结一下仅clientWidth、clientHeight、scrollLeft、scrollTop和document.documentElement.style时才用document.documentElement

3.加了这个标准以后IE的边框问题也出现了变化,现在和firefox趋于一致了,是不是这个就是XHTML的优点——跨浏览器的标准
上面提到:
设置一个div的CSS::{width:100px;height:100px;border:#000000 1px solid;}
IE中(正常情况):div的宽度(包括边框宽度):100px,div的高度(包括边框宽度):100px;
firefox(正常情况)::div的宽度(包括边框宽度):102px,div的高度(包括边框宽度):102px;

加了XHTML标准后的(IE和firefox打和了,^_^):
IE中(XHTML):div的宽度(包括边框宽度):102px,div的高度(包括边框宽度):102px;
firefox(XHTML)::div的宽度(包括边框宽度):102px,div的高度(包括边框宽度):102px;

    
 
 

您可能感兴趣的文章:

 
本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术,将尽最大努力为读者提供更好的信息聚合和浏览方式。
本站(WWW.)站内文章除注明原创外,均为转载、整理或搜集自网络。欢迎任何形式的转载,转载请注明出处。












  • 相关文章推荐
  • Firefox 23 中文版全新发布
  • linux上大家用的大都是firefox把。那你们用的是什么firefox数据同步插件呢?另外鼠标手势插件呢?
  • redhat9.0下,我安装了紫光输入法和firefox浏览器,结果发现在firefox下用“Ctrl-Shift”切换不出输入法,怎么办?有其他输入法或者浏览
  • linux 怎样 自启动 firefox 跪求指点。。。。
  • firefox 解压后不能运行
  • ubuntu下升级firefox问题
  • 网页开发FireFox插件 Firebug
  • Linux下安装FireFox下问题,急!
  • 求助,firefox安装flash的问题,第一次发贴
  • linux命令行下,无法运行firefox
  • FireFox在Linux如何编译?哪位高人能否指点一下。
  • 有没有搞错啊,CSDN的blog不支持Firefox?
  • fc9下firefox问题
  • Linux下的中文输入与Firefox的问题,谢谢!
  • firefox脱机工作问题
  • firefox看电影
  • 下了一个?firefox1.0?for?linux,但解压后?却不知怎么打开它,希望帮助,谢.? 分噢
  • Firefox 扩展开发包 Jetpack
  • Firefox for iOS
  • 沙盒中的 FireFox 浏览器 Ironfox
  • 请教几个firefox开发的问题


  • 站内导航:


    特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

    ©2012-2021,,E-mail:www_#163.com(请将#改为@)

    浙ICP备11055608号-3