表 3. Mozilla 用于操纵内容的方法
方法
说明
appendChild( aNode )
创建新的子节点。返回新建子节点的引用。
cloneNode( aDeep )
创建调用节点的副本并返回。如果 aDeep 为 true,则复制该节点的整个子树。
createElement( aTagName )
创建并返回一个 aTagName 指定类型的无父 DOM 节点。
createTextNode( aTextValue )
创建并返回一个新的无父 DOM 文本节点,值由 aTextValue 指定。
insertBefore( aNewNode, aChildNode )
在 aChildNode 前插入 aNewNode,前者必须是当前节点的子节点。
removeChild( aChildNode )
删除 aChildNode 并返回对它的引用。
replaceChild( aNewNode, aChildNode )
用 aNewNode 替换 aChildNode 并返回被删除节点的引用。
出于性能方面的原因,可以在内存中创建文档而不是处理已有文档的 DOM。DOM Level 1 Core 引入了文档片断,这是一种轻型文档包含一般文档接口的一个子集。比如没有 getElementById 但是有 appendChild。很容易向已有文档添加文档片断。
Mozilla 使用 document.createDocumentFragment() 创建文档片断,该方法返回一个空的文档片断。
但是,Internet Explorer 的文档片断实现没有遵循 W3C 标准,仅仅返回一般的文档。
Mozilla 和 Internet Explorer 的多数差异都和 JavaScript 有关。但问题通常源自浏览器向 JavaScript 公开的 API,比如 DOM 钩子。两种浏览器在核心 JavaScript 上区别不大,遇到的问题通常和时间有关。
Date 惟一的区别是 getYear 方法。根据 ECMAScript 规范(这是 JavaScript 所遵循的规范),该方法没有解决千年问题,在 2004 年运行 new Date().getYear() 将返回“104”。根据 ECMAScript 规范,getYear 返回的年份减去 1900 最初是为了在 1998 年返回“98”。ECMAScript Version 3 废止了 getYear,用 getFullYear() 代替。Internet Explorer 修改了 getYear() 使其和 getFullYear() 类似,消除了千年问题,而 Mozilla 坚持采用标准的行为方式。
不同的浏览器执行 JavaScript 的方式是不同的。比如,下列代码假设 script 块执行的时候 div 节点已经存在于 DOM 中:
... <div>Loading...</div> <script> document.getElementById("foo").innerHTML = "Done."; </script>但是并不能保证这一点。为了保证所有的元素已经存在,应该对 <body> 元素使用 onload 事件处理程序:
<body> <div>Loading...</div> <script> function doFinish() { var element = document.getElementById("foo"); element.innerHTML = "Done."; } </script> ...这类与时间有关的问题也和硬件有关,速度慢的系统可能会发现速度快的系统隐藏起来的 bug。一个具体的例子是 window.open,它打开新的窗口:
<script> function doOpenWindow(){ var myWindow = window.open("about:blank"); myWindow.location.href = "http://www.ibm.com"; } </script>这段代码的问题在于 window.open 是异步的,在窗口打开之前没有阻塞 JavaScript 的执行。因此,window.open 后面的行有可能在新窗口打开之前执行。可以在新窗口的 onload 处理程序中解决这个问题,然后回调打开它的窗口(使用 window.opener)。
JavaScript 可以通过 document.write 即时用字符串生成 HTML。主要的问题在于,如果内嵌在 HTML 文档(因此也在一个 <script> 标签中)的 JavaScript 生成的 HTML 又包含 <script> 标签怎么办。如果文档采用 ,就会把字符串中的 </script> 解释成外层 <script> 的结束标签。下面的代码很好地说明了这一点:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> ... <script> document.write("<script>alert("Hello")</script>") </script>