javascript - 如何使用 JavaScript 将 div 动态添加到数据表的 td 标记

Question

我想添加一个 div 到数据表的 td 标签。这是我的 HTML 代码:

table = $("#workLocation-table").DataTable({
            data: mainArray,
            "columnDefs": [
                { className: "details-control" , "targets": [0]},
                {
                    "order": [[1, 'asc']]
                },
                {
                "targets": -1,
                "width": "10%",
                "data": null,
                "defaultContent": '<div class="edit-wrapper"><span class="icn"><i class="fa fa-pencil-square-o" aria-hidden="true" id="edit"></i><i class="fa fa-trash-o" aria-hidden="true" id="delete"></i></span></div>'
            }]
        });

我想在目标 2 中添加一个 div，并为该 div 提供“超长”类。

Answer 1

table =  $("#workLocation-table").DataTable({
        data: mainArray,
        "columnDefs": [
            { className: "details-control" , "targets": [0]},
            {
                "order": [[1, 'asc']]
            },
            {
                "targets": 2,
                render : function(data, type, row) {
                    return '<div class="over-length">'+data+'</div>'
                } 
            },
            {
                "targets": -1,
                "width": "10%",
                "data": null,
                "defaultContent": '<div class="edit-wrapper"><span class="icn"><i class="fa fa-pencil-square-o" aria-hidden="true" id="edit"></i><i class="fa fa-trash-o" aria-hidden="true" id="delete"></i></span></div>'
        }]
    });