仅使用一列生成表

时间:2016-04-20 12:29:28

标签: javascript html

您好我尝试生成一个只有一列的表。所以我的链接只显示在一列中。

这是我的功能:

    function createTableForPdfFiles() {

        //To Create The Table
        var table = document.createElement("table");
        table.setAttribute('id', 'pdfTable');
        table.setAttribute('class', 'AANTable');

        // insert Title Row
        var TitleRow = table.insertRow();
        var cell = TitleRow.insertCell(); 
        cell.setAttribute('class', 'AANTitleRow');
        cell.setAttribute('colSpan', pdfFiles.length + 1);
        cell.appendChild(document.createTextNode("Datenblätter"));

        //Insert Table Rows
        var pdfRow = table.insertRow();
        var cell = pdfRow.insertCell(); //Where the PDF´s are displayed
        cell.setAttribute('class', 'AANPdfRow');

        for (var i = 0; i < pdfFiles.length; i++) {
            var cell = pdfRow.insertCell();
            var link = document.createElement("a");
            link.setAttribute("href", "www.test.at" + pdfFiles[i].Link);
            var linktext = document.createTextNode(pdfFiles[i].Link);
            link.appendChild(linktext);
            cell.appendChild(link);
            cell.setAttribute('class', 'AANPdfCell');

        }

        $("#divTable").append(table);
}

现在它看起来像: Wrong Table

但我希望它看起来像: good Table

那么我怎么能做到这一点呢?我试图在表中添加另一行,但调试器说不支持......任何帮助都会非常棒。

谢谢你的时间。

1 个答案:

答案 0 :(得分:5)

你必须为每个pdf创建一个新行。

Hae把这个

var pdfRow = table.insertRow();
var cell = pdfRow.insertCell(); //Where the PDF´s are displayed
cell.setAttribute('class', 'AANPdfRow');

在for

看看这个 - &gt; fiddle