Skip to main content

Create table using jQuery

Use jQuery to build up your table.

1st Method:

        $(function () {
            var contents = '';
            contents += '<div id="tableWrap">';
            contents += '<table id="basicTable">';

            for (var i = 0; i < 200; i++) {

                contents += '<tr>';
                contents += '<td>';
                contents += i;
                contents += '</td>';
                contents += '<td>';
                contents += 200 - i;
                contents += '</td>';
                contents += '</tr>';
            }

            contents += '</table>';
            contents += '</div>';

            $('body').append(contents);
        });


2nd Method:

        $(function () {

            var $wrap1 = $('<div>').attr('id', 'tableWrap');

            var $tbl1 = $('<table>').attr('id', 'basicTable');

            for (var i = 0; i < 200; i++) {

                $tbl1.append(
                            $('<tr>')
                                    .append($('<td>').text(i),
                                            $('<td>').text(200 - i))
                           );
            }

            $wrap.append($tbl1);
            $('body').append($wrap1);
        });

Comments