如何显示所有表名

Question

我有一个html表，如：

<table id="table">
    <thead>
        <tr>
            <th>ABC1</th>
            <th>ABC2</th>
            <th>ABC3</th>
        </tr>
        <tr>
            <th>xyz1</th>
            <th>xyz2</th>
            <th>xyz3</th>
        </tr>
    </thead>
    <tbody>
        <tr><td>1</td><td>2</td><td>3</td></tr>
    </tbody>

现在我的问题是如何使用jquery显示列表中的所有名称.. 我想这样显示：

1. ABC1 XYZ1
2. ABC2 XYZ2
3. ABC3 XYZ3 

Answer 1

循环遍历tr中的每个tbody，并将每个td的文字添加到ul，如下所示。

$('table thead tr').each(function (i) {
    if (i == 0) {
        $(this).find('th').each(function (j) {
            $('ul').append('<li>' + (j + 1) + '. ' + $(this).text() + '</li>');
        })            
    }
    else {
        $(this).find('th').each(function (j) {
            $('ul > li').eq(j).append(' '+$(this).text());
        });
    }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table">
    <thead>
        <tr>
            <th>ABC1</th>
            <th>ABC2</th>
            <th>ABC3</th>
        </tr>
        <tr>
            <th>XYZ1</th>
            <th>XYZ2</th>
            <th>XYZ3</th>
        </tr>
    </thead>
</table>

<ul></ul>