JavaScript自习笔记（兼容性）

来源：互联网发布：php url加密编辑：程序博客网时间：2024/06/05 00:50

1)获取样式元素样式/对元素样式进行操作
（obj.style.属性）只能获取行间样式，往往我们不会把CSS样式放在行间操作。

if(obj.currentStyle)     {//         IE支持         obj.currentStyle.属性     }     {//         FF支持 第二个参数为虚参数，貌似写什么都行，低版本的FF需要，高版本第二个参数可以不写         getComputedStyle(obj,'').属性     }

2)DOM 节点（选择子节点）
（1、元素节点(Element Node)、2、属性节点(Attribute Node)、3、文本节点(Text Node)…共12种）
在进行子查询时考虑到浏览器的兼容性问题应

for(i=0;i<obj.childNodes.length;i++)    if(obj.childNodes[i].nodeType==1)    //判断原因：FF（火狐）计算子节点时包括文本节点    {        obj.childNodes[i]+操作    }}

也可以用children来取第一层的子节点。

首尾子节点和相邻节点
同样，因为IE和FF的DOM兼容性问题，也要进行判断在使用。或者用||来选择

//方法一//　　　　　　　　　　　　　　　FF Chrome　　　　　　　　IEobj.firstElementChild?obj.firstElementChild+操作:obj.firstChild+操作//方法二var oFirst=obj.firstElementChild||obj.firstChild;再对 oFirst进行操作。

//FF Chrome　　　　　　　　IE
firstElementChild　　　　　firstChild
lastElementChild　　　　　 lastChild
nextElementSibling　　　　nextSibling
previousElementSibling　　previousSibling

这里的写法让我想到一道面试题，见附2。

3）class选择

//  FF Chrome 直接可以使用 document.getElementsByClassName('cName');// IE 不支持var obj =docment.getElementByTagName('*');//先选出所有元素，再判断classNamefor(var i=0;i<obj.length;i++)       {           if(obj[i].className=='cName')           oLi[i].style.backgroundColor='red';       }

4）scrollTop 值

document.documentElement.scrollTop // IE FF           Chrome中虽然不报错，但始终是0document.body.scrollTop// Chrome      IE中是0 FFvar scrollTop=document.documentElement.scrollTop||document.body.scrollTop;

未完待续…

附加知识：
附1：
HTML DOM节点类型：

const unsigned short　　ELEMENT_NODE = 1;　　　　　　//元素节点
const unsigned short　　ATTRIBUTE_NODE = 2;　　　　　//属性节点
const unsigned short　　TEXT_NODE = 3;　　　　　　　　//文本节点
const unsigned short　　CDATA_SECTION_NODE = 4;　　　　　//CDATA节点
const unsigned short　　ENTITY_REFERENCE_NODE = 5;　　　　//实体引用名称节点
const unsigned short　　ENTITY_NODE = 6;　　　　　　　　　　//实体名称节点
const unsigned short　　PROCESSING_INSTRUCTION_NODE = 7;　//处理指令节点
const unsigned short　　COMMENT_NODE = 8;　　　　　　　//注释节点
const unsigned short　　DOCUMENT_NODE = 9;　　　　　　　 //文档节点
const unsigned short　　DOCUMENT_TYPE_NODE = 10;　　　　 //文档类型节点
const unsigned short　　DOCUMENT_FRAGMENT_NODE = 11; 　　//文档片段节点
const unsigned short　　NOTATION_NODE = 12; 　　　　　//DTD声明节点

例如判断某节点类型可以用 *.nodeType==
当然你也可用用 *.nodeTypeName
DOM定义了一个Node接口，这个接口在javascript中是作为Node类型实现的，而在IE8-浏览器中的所有DOM对象都是以COM对象的形式实现的。所以，IE8-浏览器并不支持Node对象的写法。

附2：

alert(1||2);alert(1&&2);请问输出结果？

阅读全文

1 0