开发跨浏览器javascript常见注意事项
2024-05-06 14:16:18
供稿：网友
一、向表追加行
在以往使用Ajax的经历中，你很可能会使用JavaScript向现有的表中追加行，或者从头创建包含表行的新表。document.createElement和document.appendChiid方法可以使这很容易做到,只需使用document.createElement创建表单元格,再使用document.app-endChild方法将这些表单元格增加到表行。接下来的编辑步骤是使用document.append-
Child将表行增加到表中。
在Firefox、Safari和Opera等当前浏览器中,这样做是可以的。不过,如果使用的是lE，表行则不会在表中出现。更糟糕的是，IE甚至不抛出任何错误，或对表行确实已经追加到表中却不会显示出来的问题提供任何线索。
在这种情况下，解决方法很简单。IE允许将tr元素增加到tbody元素，而不是直接增加到table元素。例如，如果定义一个空表如下：
<table id="myTable">
<tbody id="myTableBody"></tbody>
</table>
向这个表中增加行的正确做法是把行增加到表体，而不是增加到表，如下所示：
var cell=document.createElement("td").appendChild(document.createTextNode("foo"));
vat row=document.createElement("tr").appendChild(cell);
document.getElementByld("myTableBody").appendChiid(row);
辛运的是，这种方法在所有当前浏览器上都能用，也包括IE。如果你养成习惯，总是使用表中的表体，就不用担心这个问题了。
二 通过javascript设置元素的样式
利用Ajax技术，开发人员创建的Web应用可以与服务器无缝地通信，而无需完全页面刷新。但对于A1ax请求，是不会出现这种页面闪烁的，所以用户可能不知道页面上有些数据已经更新。你可能想修改某些元素的样式，指示页面上一些数据已经改变。例如，如果股票的价格已经通过Ajax请求得到了无缝更新，可以加亮显示这支股票的名字。
可以通过JavaScript使用元素的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:bold; color:red;";
这种方法在IE和大多数其他浏览器上部能很好地工作，只有Opera除外。为了让代码在所有当前浏览器上都可移植，可以同时使用这两种方法，也就是既使用setAttribute方法，也使用元素style对象的cssText属性，如下所示：
var spanElement = document.getElementById("mySpan");
spanElement.setAttribute("style", "font-weight:bold; color:red;");
