基于 html 属性的动态 jquery 选择器

Question

我有以下代码：

<table id="Product">
       <thead>
              <tr>
                    <th>ProductId</th>
                    <th>Productname</th>
                    <th>Quantity</th>
                    <th>UnitPrice</th>
              </tr>
       </thead>
       <tbody>

       </tbody>
</table>

<button id="add" data-table="Product" data-url="Product/Add"></button>

然后在 javascript 文件中：

     $('#add').click(function () {
            var url = $(this).attr("data-url");
            var table = $(this).attr("data-table");
            var tableBody = ???; 
            //some logic with tablebody

    });

如何获取 table 的 table 正文？

Answer 1

$('#add').click(function () {
    var $this = $(this);
    var url = $this.data("url");
    var tableId = $this.data("table");
    var $tableBody = $("#" + tableId + " tbody");
});

在 https://api.jquery.com/category/selectors/

阅读有关 jQuery 选择器的更多信息

这里我使用的是ID Selector and the Descendant Selector.

Answer 2

 $('#add').click(function () {
        var url = $(this).attr("data-url");
        var table = $(this).attr("data-table");
        var tableBody = $("#" + table).find("tbody"); 
        //some logic with tablebody

});