開發跨瀏覽器的JavaScript方法說明第1/2頁

開發跨瀏覽器的JavaScript

1. childNodes在ff中和ie的區別。

ff中的node(nodeType = 1)都是用textNode(nodeType = 3)分開的，而ie/op不是這樣的。

<div id="box1"><span>content</span></div>

在ff下,box1的childNodes為3個，ie下為1個。

2. 設定某個node對象的style class名稱。

ie中要設定某個node的class用"className"作為attr來set或者get。

ff等其它的瀏覽器用"class"作為attr來set或者get。

代碼:

if(typeof node1.getAttribute("className") == "string") {

.

}

3. 設定某個node對象的style content。

直接舉例把

代碼:

var oStyle = oNode.getAttribute("style");

// ie

if(oStyle == "[object]") {

oStyle.setAttribute("cssText", strStyle);

oNode.setAttribute("style", oStyle);

} else {

oNode.setAttribute("style", strStyle);

}

4. 事件對象。

ie用event

ff用evnt

5. 事件作用對象

ie用objEvent.srcElement

ff用objEvent.target

這個跟 xml 檔案寫作有關，將 IE 的 preserveWhiteSpace 設為 true 看看，底下是取自微軟的說明檔案
代碼:

var xmlDoc = new ActiveXObject("Msxml2.DOMDocument.4.0");

xmlDoc.async = false;

xmlDoc.preserveWhiteSpace = true;

xmlDoc.load("books.xml");

alert(xmlDoc.xml);

xmlDoc.async = false;

xmlDoc.preserveWhiteSpace = false;

xmlDoc.load("books.xml");

alert(xmlDoc.xml);

-----------------------

1.向表中追加行：

document.createElement 和document.appendChild方法可以很容易的做到向表中追加行或從頭建立包含表行的新表：使用 document.createElement建立表格，在使用document.appendChild方法將這些表儲存格增加到表行；接下來使用 document.appendChild將表行增加到表中。

IE允許講tr元素增加到tbody中，而不是直接增加到table中。

<table id="myTable">

<tbody id="myTableBody"></tbody>

</table>

向這個表中增加行的正確做法是把行增加到表體，而不是增加到表，如是所示：

var cell=document.createElement("td").appendChild(document.createTextNode("foo");

var row = document.createElement("tr").appendChild(cell);

document.getElementById("mysqlTableBody").appendChild(row);

幸運的是，這種方法在所有當前瀏覽器都通用，也包括IE。如果你養成習慣，總是使用表中的表體，就不用擔心這個問題了。

2 通過Javascrīpt設定元素的樣式

可以通過Javascrīpt使用元素的setAttribute方法設定元素的樣式。例如，要把span 元素中的文本修改為採用紅色粗體顯示，可以使用setAttribute方法如下:

var spanElement = document.getElementById("mySpan");

spanElement.setAttribute("style","font-weight:bold ; color: red;");

除了IE，這種方法在當前其它瀏覽器上都是行得通的.對於IE，解決方案是使用元素 style對象的cssText屬性來設定所需樣式，儘管這個屬性不是標準的，但是得到廣泛支援， 如下所示：

var spanElement = document.getElementById("mySpan");

spanElement.style.cssText = "font-weight:blod ; color:red;";

這種方法在IE和大多數其他瀏覽器上都能很好好工作，只有Opera除外。為了讓代碼在 所有當前瀏覽器上都可移植，可以同時使用這兩種方法，也就是既使用setAttribute方法， 又使用style對像的cssText屬性，如下所示：

var spanElement = document.getElementById("mySpan");

spanElement.setAttribute("style","font-weight:bold ; color: red;");

spanElement.style.cssText = "font-weight:blod ; color:red;";