liqingyi's blog

快乐无求

导航

« 关于javascript 面试题javascript正则表达式详解 »

javascript添加行 firefox与IE 的兼容问题总结

table.insertRow()在IE下没问题 但在firefox下就得改为table.insertRow(-1)
同样其相应的insertCell()也要改为insertCell(-1)

var newTh = table.insertRow(-1);
               
                newTh.style.backgroundColor="#C8ECEC";
                newTh.align="center";
               
                //表头TD

                var newTh1 = newTh.insertCell(-1);
                var newTh2 = newTh.insertCell(-1);
                var newTh3 = newTh.insertCell(-1);
                var newTh4 = newTh.insertCell(-1);
 
开发跨浏览器JavaScript时要注意的问题
减小字体 增大字体 作者:liqun  来源:www.comecode.com  发布时间:2007-8-9 23:34:49

1、          向表中追加行

定义table时使用tbody元素,以保证包括IE在内的所有浏览器可用

例:定义如下一个空表

<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(“myTableBody”).appendChild(row);

*IE中需要先创建行,再创建列,再创建内容

2、          设置元素的样式

Var spanElement = document.getElementById(“mySpan”);

//下面写法保证出IE外,所有浏览器可用

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

//下面的写法保证IE可用

spanElement.style.cssText=”font-weight:bold;color:red;”;

3、          设置元素的class属性

Var element = document.getElementById(“myElement”);

//下面的写法保证除IE外,所有浏览器可用

Element.setAttribute(“class”,”styleClass”);

//下面写法保证IE可用

Element.setAttribute(“className”,”styleClass”);

4、          创建输入元素

Var button = document.createElement(“input”);

//单行文本框、复选框、单选框、单选钮、按钮需要此属性区别

Button.setAttribute(“type”,”button”);

Document.getElementById(“formElement”).appendChild(button);

5、          向输入元素增加事件处理程序

Var formElement=document.getElementById(“formElement”);

//所有浏览器可用

formElement.onclick=function(){doFoo();};

//除IE外,所有浏览器可用

formElement.setAttribute(“onclick”,”doFoo();”);

6、          创建单选钮

If(document.uniqueID){

      //Internet Explorer

      Var radioButton=document.createElement(“<input type=’radio’ name=’radioButton’ value=’checked’>”);

}else{

      //Standards Compliant

      Var radioButton=document.createElement(“input”);

      radioButton.setAttribute(“type”,”radio”);

      radioButton.setAttribute(“name”,”radioButton”);

      radioButton.setAttribute(“value”,”checked”);

}

7、          insertRow,insertCell,deleteRow

在IE中,table.insertRow()如果没有指定参数,则在表格后面添加行,默认参数位-1;如果在Firefox中,则一定要加参数,如:insertRow(-1)。

1、          向表中追加行

定义table时使用tbody元素,以保证包括IE在内的所有浏览器可用

例:定义如下一个空表

<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(“myTableBody”).appendChild(row);

*IE中需要先创建行,再创建列,再创建内容

2、          设置元素的样式

Var spanElement = document.getElementById(“mySpan”);

//下面写法保证出IE外,所有浏览器可用

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

//下面的写法保证IE可用

spanElement.style.cssText=”font-weight:bold;color:red;”;

3、          设置元素的class属性

Var element = document.getElementById(“myElement”);

//下面的写法保证除IE外,所有浏览器可用

Element.setAttribute(“class”,”styleClass”);

//下面写法保证IE可用

Element.setAttribute(“className”,”styleClass”);

4、          创建输入元素

Var button = document.createElement(“input”);

//单行文本框、复选框、单选框、单选钮、按钮需要此属性区别

Button.setAttribute(“type”,”button”);

Document.getElementById(“formElement”).appendChild(button);

5、          向输入元素增加事件处理程序

Var formElement=document.getElementById(“formElement”);

//所有浏览器可用

formElement.onclick=function(){doFoo();};

//除IE外,所有浏览器可用

formElement.setAttribute(“onclick”,”doFoo();”);

6、          创建单选钮

If(document.uniqueID){

      //Internet Explorer

      Var radioButton=document.createElement(“<input type=’radio’ name=’radioButton’ value=’checked’>”);

}else{

      //Standards Compliant

      Var radioButton=document.createElement(“input”);

      radioButton.setAttribute(“type”,”radio”);

      radioButton.setAttribute(“name”,”radioButton”);

      radioButton.setAttribute(“value”,”checked”);

}

7、          insertRow,insertCell,deleteRow

在IE中,table.insertRow()如果没有指定参数,则在表格后面添加行,默认参数位-1;如果在Firefox中,则一定要加参数,如:insertRow(-1)。
  • 相关文章:

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

Powered By Z-Blog 1.7 Laputa Build 70216

Copyright 2006-2008 www.imeimei.com Some Rights Reserved. 冀ICP备06035462号
声明:本博客无任何商业目的,所发表文章只为学习与交流为目的