首页 > 技术文章 > 以后就在这里做笔记,记下遇到过的跟浏览器兼容性有关的内容

luke21 2014-02-26 17:03 原文

可惜之前遇到过的都没有记录下来。

1、cloneNode()方法不会复制添加到DOM节点中的javascript属性,例如事件处理程序。这个方法只复制特性或者子节点。但是IE在这里有bug,会把事件处理程序也复制过去。

2、IE7及较低版本中使用document.getElementById()时,name特性与给定ID匹配的表单元素也会被该方法返回。

3、在IE7及以前版本中,用getAttribute()方法访问style或者onclick这样的事件处理特性时,返回的值与属性的值(document_ele.style或者document_ele.onclick)相同,均为对象或者javascript函数。而在其他浏览器或者其他版本的IE中,getAttribute()返回的是CSS或者方法的文本,属性的值是对象或者javascript函数。

    因此开发人员一般不用getAttribute()访问HTML特性

4、在IE7及以前版本中,用setAttribute()方法设置class和style特性,没有任何效果,而使用这个方法设置事件处理程序特性时也一样。

5、IE6及以前的版本不支持removeAttribute();

6、对于如下的代码

    <ul>

        <li>Item1</li>

        <li>Item2</li>

        <li>Item3</li>

    </ul>

    ul的childNodes,在IE中有7个,在其他浏览器中有3个。   因为IE中将<ul>到</ul>中间的4个空格算成了4个文本节点。

7、IE中,<style> <script>被视为特殊节点,不允许DOM访问其子节点。

8、用style属性访问元素的float特性时,由于float是javascript的保留字,因此不能直接用style.float访问。IE中,属性名为styleFloat,而在其他浏览器中,相应的属性名为cssFloat。

9、计算样式表。

    IE,style.currentStyle。 其他浏览器 document.defaultView.getComputedStyle(ele,another); another为伪元素字符串,一般可用null。

    两者获得的样式表都是只读的,而且会包含浏览器的一些默认样式(可能你之前并没有设定过)。

10、CSS

    :link :visited成为链接伪类,只能应用于锚元素。:hover :active :focus称为动态伪类,理论上可以应用于任何元素。

    对于三个动态伪类,IE6只注意应用于锚元素的:active 和:hover选择器,完全忽略:focus;

    IE7在任何元素上都支持:hover 但是忽略:active和:focus

11、CSS

    对于子选择器,IE7中有bug,父元素与子元素之间有注释,就会出现问题。IE6及以下不支持。

    相邻同胞选择器有同样的bug

12、CSS

    IE6不支持属性选择器

13、CSS

    IE的早期版本和Opera使用左外边距控制列表的缩进,而Safari等现代浏览器则使用左内边距。

14、CSS

    IE6在列表项上下增加了额外的空间。可以通过display:inline解决。

15、CSS

    IE不显示其内容隐藏在屏幕之外的链接。

    解决方法是,设置一个url作为链接的背景,可以是无意义的url,最好是透明的图像。

16、CSS

    IE将text-align: center误以为让所有东西都居中,不止是文本。

 

    

 

 

 

 

 

 

推荐阅读