innerHTML 只读问题 & 两个动态修改 Table 的 js 函数

作者: , 共 3006 字

最近做社会实践项目遇到的一个问题,需要动态修改一个表格。本来以为要想修改一行,直接设置新的 tr.innerHTML 即可。后来发现在 Firefox 下可行,但在 IE 下通不过,查看了一下帮助,才发现 innerHTML 还没有一个通用标准,而在 IE 下innerHTML对于标签为 COL, COLGROUP, FRAMESET, HTML, STYLE, TABLE, TBODY, TFOOT, THEAD, TITLE, TR 的元素是只读的。要想在 IE 下动态修改表格,只能使用 insertRow 和 insertCell;

下面这个函数往表格i里添加一行,此行的 HTML 代码为t。

// insert a row with HTML code t to table i; 
// t: the full HTML code of the row
// i : the table element
// Return the row added
function addRow(t, i) {
    if (typeof(i) == "string")  i = document.getElementById(i);

    var f = t.indexOf('>'), l = t.lastIndexOf('</'),
        tag = t.substr(l+2, t.length-l-3), e;

    if (tag == 'tr') e = i.insertRow(-1);
    else {
        e = document.createElement(tag);
        i.appendChild(e, i);
        e.innerHTML = t.substr(f+1, l-f-1);
    }

    s = t.substr(1, f-1).split(' ');
    for (i=0; i<s.length; i++) {
        ss = s[i].split('=');
        if (ss.length==1) continue;
        e.setAttribute(ss[0], strip(ss[1]));
    }

    ti = t.substr(f+1, l-f-1);
    if (t.substr(l+2, t.length-l-3) == 'tr') {
        var tf;
        while( (tf = ti.indexOf("<td>")) != -1) {
            ti = ti.substr(tf+4, ti.length-tf-4);
            var te = e.insertCell(-1);
            tl = ti.indexOf("</td>");
            te.innerHTML = ti.substr(0, tl);
            ti = ti.substr(tl, ti.length-tl);
        }
    }

    return e;

    function strip(ss) {
        if (ss[0]=='\''|| ss[0] == "\"")
            return ss.substr(1, ss.length-2);
    }
}

下面这个函数将表格的i行改写为代码t :

// modify row i with row of HTML code t
// t: HTML code 
// i: the row element, get by table.rows[row_index]
// return the row modified
function modifyRow(t, i) {
    var f = t.indexOf('>'), l = t.lastIndexOf('</'),
        tag = t.substr(l+2, t.length-l-3), e;

    if (tag == 'tr') e = i;
    else {
        e = document.createElement(tag);
        i.appendChild(e, i);
        e.innerHTML = t.substr(f+1, l-f-1);
    }

    s = t.substr(1, f-1).split(' ');
    for (i=0; i<s.length; i++) {
        ss = s[i].split('=');
        if (ss.length==1) continue;
        e.setAttribute(ss[0], strip(ss[1]));
    }

    var ti = t.substr(f+1, l-f-1), ri = 0;
    if (t.substr(l+2, t.length-l-3) == 'tr') {
        var tf;
        while ( (tf = ti.indexOf("<td>")) != -1 ) {
            ti = ti.substr(tf+4, ti.length-tf-4);
            var te;
            if (e.cells.length <= ri)    te = e.insertCell(-1);
            else te = e.cells[ri];
            ri++;
            tl = ti.indexOf("</td>");
            te.innerHTML = ti.substr(0, tl);
            ti = ti.substr(tl, ti.length-tl);
        }
    }

    return e;

    function strip(ss) {
        if (ss[0]=='\''|| ss[0] == "\"")
            return ss.substr(1, ss.length-2);
    }
}

Q. E. D.

类似文章:
编程 » SQL
现在 Access 用的人应该不多了,本来我以为我也不可能用这玩意儿,但最近在用 VBA 通过 SQL 处理数据时,发现它的语法是 Access 的语法。平时对 SQL Server 语法相对熟悉一些。下文总结了 Access 和 SQL Server 语法的差异。
相似度: 0.071
投资 » 债券学院, 基点
我在前面债券的敏感性里简单介绍过债券的 DV01 ,即俗称的基点价值。那篇文章还不够完整,我这里再补充一下。
编程 » Matlab, 优化
最近做了些东西,用到了 Matlab 的优化工具箱, optimization toolbox。因为以前没用过这东西,今天把这个工具箱的帮助文档基本上翻了一遍。
Excel 有一个很有用的功能是直接导入外部数据库或者使用外部数据源建立数据透视表和数据透视图。但比较可惜的是,这个数据源的查询语句是静态的,它无法根据日期自动修改(比如在应用中,我们希望每天获取的外部数据都是当天最新的数据),下面两个函数是修改外部数据源的 VBA 代码,调用它们就可以建立动态的数据源。
编程 » Excel, lotus, VBA
公司使用 Lotus ,我每天都通过 Excel 编写 VBA 代码自动调用 Lotus 发送邮件,发现一个奇怪的现象。一般我们通过下面的 VBA 代码指定邮件收件人:
相似度: 0.051
BASEL 的框架要求所有使用内部模型法计量市场风险必须要进行回溯测试。回溯测试可以:
数学 » Ponder this, 几何
今年 IBM 七月份的 Ponder This 问题(原题在这里,英文):
间断的看完了朋友推荐给我的这本武侠小说。