检查datatables中的子行

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.25/css/jquery.dataTables.min.css">
<script src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script>

<table id="example" class="display" style="width:100%"></table>

$(document).ready(function() {
    var table = $('#example').DataTable({
        columns: [
            { data: 'name', title: 'Name' },
            { data: 'position', title: 'Position' },
            { data: 'office', title: 'Office' },
            { data: 'salary', title: 'Salary' }
        ],
        data: [
            { name: 'Tiger Nixon', position: 'System Architect', office: 'Edinburgh', salary: '$320,800' },
            { name: 'Garrett Winters', position: 'Accountant', office: 'Tokyo', salary: '$170,750' },
            { name: 'Ashton Cox', position: 'Junior Technical Author', office: 'San Francisco', salary: '$86,000' }
        ],
        rowGroup: {
            dataSrc: 'office'
        },
        responsive: true
    });

    // 子行的展开和收起
    $('#example tbody').on('click', 'td.details-control', function () {
        var tr = $(this).closest('tr');
        var row = table.row(tr);

        if (row.child.isShown()) {
            // 子行已展开，收起子行
            row.child.hide();
            tr.removeClass('shown');
        } else {
            // 展开子行
            row.child(format(row.data())).show();
            tr.addClass('shown');
        }
    });

    // 格式化子行的内容
    function format(d) {
        return '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">' +
            '<tr>' +
            '<td>Full name:</td>' +
            '<td>' + d.name + '</td>' +
            '</tr>' +
            '<tr>' +
            '<td>Position:</td>' +
            '<td>' + d.position + '</td>' +
            '</tr>' +
            '<tr>' +
            '<td>Salary:</td>' +
            '<td>' + d.salary + '</td>' +
            '</tr>' +
            '</table>';
    }
});