javascript - 如何获取表行的所有子元素并动态更改数据？

Question

我有一个带有标题内容的表格，如下所示。

<table id="example" class="display" cellspacing="0" width="100%">
            <thead>
                <tr>
                    <th>
                       Date
                    </th>
                    <th>
                        Year
                    </th>
                    <th>
                        HalfYear
                    </th>
                    <th>
                        Quarter
                    </th>
                    <th>
                        Month
                    </th>
                    <th>
                        Site
                    </th>
               </tr>
         </thead>
</table>

所以从上表中我试图阅读所有 <th>标记内容/数据并动态用新数据替换内容。

如何获取所有 <th>元素内容并使用 jQuery 中的新内容对其进行编辑。

Answer 1

您可以使用其 each 函数迭代所选 jQuery 对象的集合，例如:

$('th').each(function (iteration, node) {
    var oldCaption = $(node).text();
    $(node).text(oldCaption + ' renewed');
});

有关示例中使用的函数的更多详细信息，请参阅 jQuery 文档:

• http://api.jquery.com/jquery.each/
• http://api.jquery.com/text/