Firefox 的 innerHTML 替代方案答案

【问题标题】：innerHTML alternative for firefoxFirefox 的 innerHTML 替代方案
【发布时间】：2012-02-27 08:33:13
【问题描述】：

我正在用以下代码行填充 html 表格

Javascript：

var newTR = document.createElement("TR");
var newTD;

    newTD = document.createElement("TD");
    newTD.width = "22%"

    newTD.innerHTML = "<input type='text' name='AppOrderTxt1' readOnly='true'"+  
     "' id='AppOrderTxt' value=' test'  class='text-noborders' onFocus='this.blur()' size='3'/>";

    newTR.appendChild(newTD);

    if(document.all){
        tblRCRPCombo.children[0].appendChild(newTR);
    }else{

       tblRCRPCombo.insertRow(tblRCRPCombo.rows.length);                           
       tblRCRPCombo.rows[tblRCRPCombo.rows.length-1].innerHTML=newTR.innerHTML;
    }

当我试图通过名称 AppOrderTxt1 获取请求参数值时，它在 FireFox 中返回 null，而在 IE 中也是如此。

【问题讨论】：

输入是否出现在 HTML 页面中？如果修复语法错误（在 id 属性之前有一个额外的引号），它是否有效？
我已经删除了额外的报价，但它没有任何区别

标签： javascript html firefox innerhtml

【解决方案1】：

可能不是问题，但你有一个额外的'：

newTD.innerHTML = "<input type='text' name='AppOrderTxt1' readOnly='true'"+  
     " id='AppOrderTxt' value=' test'  class='text-noborders' onFocus='this.blur()' size='3'/>";

另外，第一个 if 语句在 firefox 中工作，但由于 (document.all)，firefox 不会输入它。如果你只有这一行...

tblRCRPCombo.children[0].appendChild(newTR);

...而不是整个 if else 语句，那么它将在 FF 和 IE 中工作。

原因如下：https://developer.mozilla.org/en/Mozilla_Web_Developer_FAQ

一些专有文档对象，例如 document.all 和 document.layers 不是 W3C DOM 的一部分，在 Mozilla。（对 document.all 有部分无法检测到的支持，但是，在较新版本的 Mozilla 中。但是，该功能仅存在是为了与专为 IE 创作的网站兼容。你不应依赖 Mozilla 对新页面的 document.all 支持。）可以使用 document.getElementById() 方法。

【讨论】：

我已经删除了那个额外的报价和 if 条件，但它仍然没有任何区别
jsfiddle.net/CvK5R/6 这在 FF 10 和 IE 8 中都适用于我。这可能是一个愚蠢的问题，但您是否声明了 tblRCRPCombo 变量？

【解决方案2】：

将innerHTML 替换为textContent：

tblRCRPCombo.rows[tblRCRPCombo.rows.length-1].textContent = newTR.textContent;

【讨论】：