附加的行组作为 jquery 响应不尊重表条带表样式答案

【问题标题】：Appended group of rows as jquery response do not respect table-striped table style附加的行组作为 jquery 响应不尊重表条带表样式
【发布时间】：2019-12-31 16:09:30
【问题描述】：

我收到了第一个表单提交的第一个表格响应。该表使用定义的 boostrap.css 样式 n.table-striped 设置为白色 bg 奇数行：

<table class="table table-striped" id="offers-product">

在 boostrap.css 中

.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: #f9f9f9;
}

后端返回前10个结果；如果最终用户希望再获得 10 个，则有一个“更多结果”按钮，单击该按钮会触发以下 jquery 代码：

function show_offers(render, from_item, to_item, products_id_list, searchedGeneric, searchedMade, searchedCountries, searchedFormats, searchedCurrency){

      if (render == 'PCRender') {

   $.ajax({
      method:'POST',
      url: ajax_url+'frontController/addRenderPCScreenOffers',
      data:{  render:render,
              from_item:from_item,
              to_item:to_item,
              products_id_list:products_id_list,
              searchedGeneric:searchedGeneric,
              searchedMade:searchedMade,
              searchedCountries:searchedCountries,
              searchedFormats:searchedFormats,
              searchedCurrency:searchedCurrency
           },
      dataType:'text',

      success:function(res)
      { 
        $("#offers-product").append(res);
      }

   });   

}

}

显然， res 具有正确的 html 行代码。问题是添加的行不遵守表格样式 table-striped ，因此奇数行的 bk 与偶数行相同；只是添加的行，第一行没问题。我怎样才能让添加的行也尊重正确的表格样式，交替它们的 bk 颜色？

【问题讨论】：

你能添加一个 res 的样本吗？添加console.log(res);追加后。谢谢
您可能需要进入表格主体标签，例如$("#offers-product tbody")
似乎元素被附加到<table>而不是<tbody>，这是你的CSS所依赖的。
@David Thomas：你说得对，我有 [第一个正确的行] [添加的行] 那么我如何使用 JS/jQuery 来添加新行在正确的位置？任何特定的单行命令？也许 kasper Jalvas Jensen $("#offers-product tbody") 是如何建议的？

是的，这应该可以很好地工作（我看到你已经发布了一个详细说明的答案，现在）。祝你好运！

标签： javascript jquery html html-table

【解决方案1】：

@Kasper Halvas Jensen 和@David Thomas 的建议解决了这个问题，谢谢。所以总结一下我已经替换了这个

$("#offers-product").append(res);

有了这个

$("#offers-product tbody").append(res);

【讨论】：