-1

我正在尝试使用用户脚本动态生成表。

    var divWrap = document.createElement('div');
        divWrap.style.fontFamily = "sans-serif";
        divWrap.style.width = "100%";
    var spanTitle = document.createElement('span');
        spanTitle.style.marginRight = "auto";
        spanTitle.style.marginLeft = "auto";
        spanTitle.style.fontSize = "1.5em";
        spanTitle.innerHTML = "Countdown";
        divWrap.appendChild(spanTitle);
    var createTable = document.createElement('table');
        createTable.style.marginLeft = "auto";
        createTable.style.marginRight = "auto";
        createTable.style.width = "50%";
        createTable.id = "cdn_table"
        divWrap.appendChild(createTable);
    createTable.appendChild(addRow("test", "12d"));
    createTable.appendChild(addRow("test2", "24h"));
    mainDiv.getElementsByTagName('span')[0].appendChild(divWrap);

function addRow(rName, rValue) {
    console.log(rName + ": " + rValue);
    var row = document.createElement('tr');
    var tName = document.createElement('td');
    tName.innerHTML = rName;
    var tValue = document.createElement('td');
    tValue.innerHTML = rValue;
    row.appendChild(tName);
    row.appendChild(tValue);
    return row;
}

问题是所有元素都像这样呈现在一行中：http: //i.imgur.com/MjMtdDg.png

我缺少一些css值吗？或者是其他东西？我想在 Firefox 中使用 Scriptish 在该缩略图中插入简单的标题和表格。

4

1 回答 1

1

表格有自己的用于添加行/单元格的界面。

var t = document.createElement("table");
var r = t.insertRow(-1);
var c = r.insertCell(-1);
c.innerHTML = "Foo";
c = r.insertCell(-1);
c.innerHTML = "Bar";

document.body.appendChild(t);

http://jsfiddle.net/tQWm8/1/

于 2014-02-22T22:45:39.393 回答