如何在非IE浏览器中强制将tbody元素放入空表

Question

我有一个相当复杂的旧InFragurs型UltraWebGrid的实现。尽管他们只是告诉我要升级，我还是想把它强加给浏览器兼容性。我的网格不会为非IE浏览器的某个网格呈现行。我已经追踪到了一些内置的javascript错误，我将在下面添加它。我认为我可以通过在网格html表中添加一个tbody元素来强制网格工作，然后再尝试呈现动态添加的行。我遇到这个想法的逻辑如下。我该怎么做呢？

根据This SO question，只有IE会自动将tbody元素添加到空表中。其他浏览器至少需要一行tbody元素才能存在。似乎阻止该网格呈现的javascript错误是无法获取主网格表的tbody元素。如果浏览器不是IE，应该可以通过javascript在表格中强制tbody元素来解决这个问题。

用javascript构建的旧的infragistics网格似乎假设这个tbody元素将存在于一个空网格中。正因为如此，我的页面无法在非IE浏览器中加载网格的行，因为javascript正在调用一个不存在的元素。

破坏javascript：

(对于非IE浏览器，这会在最后一行中断。我假设是因为没有tbody元素)

var strTransform = this.applyXslToNode(this.Node);
if (strTransform)
{
    var anId = (this.AddNewRow ? this.AddNewRow.Id : null);
    this.Grid._innerObj.innerHTML = "<table style=\"table-layout:fixed;\">" + strTransform + "</table>";
    var tbl = this.Element.parentNode;
    igtbl_replaceChild(tbl, this.Grid._innerObj.firstChild.firstChild, this.Element);
    igtbl_fixDOEXml();
    var _b = this.Band;
    var headerDiv = igtbl_getElementById(this.Grid.Id + "_hdiv");
    var footerDiv = igtbl_getElementById(this.Grid.Id + "_fdiv");
    if (this.AddNewRow)
    {
        if (_b.Index > 0 || _b.AddNewRowView == 1 && !headerDiv || _b.AddNewRowView == 2 && !footerDiv)
        {
            var anr = this.AddNewRow.Element;
            anr.parentNode.removeChild(anr);
            if (_b.AddNewRowView == 1 && tbl.tBodies[0].rows.length > 0)
                tbl.tBodies[0].insertBefore(anr, tbl.tBodies[0].rows[0]);
            else
                tbl.tBodies[0].appendChild(anr);
        }
        this.AddNewRow.Element = igtbl_getElementById(anId);
        this.AddNewRow.Element.Object = this.AddNewRow;
    }
    this.Element = tbl.tBodies[0];
    this.Element.Object = this;

Answer 1

我建议您在顶部设置innerHTML时添加tbody。检查strTransform是否已经包含tbody，如果没有，请自己添加一个。类似于：

var tadd1 = '';
var tadd2 = '';
if (!(/\<tbody\>/.test(strTransform))) {
    tadd1 = '<tbody>';
    tadd2 = '</tbody>';
}
this.Grid._innerObj.innerHTML =
    "<table style=\"table-layout:fixed;\">" + tadd1 + strTransform + tadd2 + "</table>";