Question

我有一个简单的javascript函数，可以将一行文本框拆分成多行。功能如下：

function newline(componentID)
{

    var cols = document.getElementById(componentId).getElementsByTagName('td');
    var colslen = cols.length;
    var i = -1;
    var tempInnerHTML = '<tbody><tr>';

    while (++i < colslen)
    {
        tempInnerHTML += '<td>' + cols[i].innerHTML + '</td>'
        if ( i == 9 || i == 19 || i==29 ) { tempInnerHTML += '</tr><tr>'; }
    }
    tempInnerHTML += '</tr></tbody>';
    document.getElementById(componentId).InnerHTML = tempInnerHTML; 

}

该功能在FireFox上运行正常，但在IE 9.0中不起作用原因是document.getElementById(componentId).InnerHTML = tempInnerHTML; 即我们不能直接在IE 9.0中设置innerHTML

所以我尝试将上面的功能更改为：

function newline(componentID)
{

    var cols = document.getElementById(componentId).getElementsByTagName('td');
    var colslen = cols.length;
    var i = -1;
    var tempInnerHTML = '<tbody><tr>';

    while (++i < colslen)
    {
        tempInnerHTML += '<td>' + cols[i].innerHTML + '</td>'
        if ( i == 9 || i == 19 || i==29 ) { tempInnerHTML += '</tr><tr>'; }
    }
    tempInnerHTML += '</tr></tbody>';
    var div = document.createElement("div");
    div.innerHTML = tempinnerHTML;
    document.getElementById(componentId).appendChild(div.firstChild.tBodies[0]); 

}

但是，上述功能在FireFox和IE 9.0上都不起作用问题是声明

document.getElementById(componentId).appendChild(div.firstChild.tBodies[0]);

我需要让函数同时适用于FireFox和IE 9.0。

非常感谢任何帮助。

提前致谢!!

Answer 1

这不适用于任何浏览器。

更改

document.getElementById(componentId).InnerHTML = tempInnerHTML;

到

document.getElementById(componentId).innerHTML = tempInnerHTML;

JavaScript区分大小写。

编辑后：您还有其他错误：

tempInnerHTML += '</tr></tbody>';
var div = document.createElement("div");
div.innerHTML = tempinnerHTML;

您无法向div添加tbody。某些浏览器可能会尝试通过插入表来为您修复它，但这不是指定的行为。您应该创建一个table元素（并跳过firstChild步骤）。你甚至可能不应该使用这个div或table，这是一个无用的步骤：直接创建tbody并附加它。

设置innerHTML在Internet Explorer 9.0中不起作用

1 个答案: