引导表上的数据 URL 选项添加边框答案

【问题标题】：Data-URL option on Bootstrap Table adding borders引导表上的数据 URL 选项添加边框
【发布时间】：2020-06-21 22:40:16
【问题描述】：

在我的页面上，我有两个使用 Bootstrap Table 制作的表格。其中一个我手动将数据输入到行和列中，另一个填充data-toggle="table" data-url="working-url.php"。它们都有table-borderless 类，但是当生成带有data-url 的表时，table-bordered 类似乎是自动添加的。正如预期的那样，另一个表没有边框。

有没有办法改变这种行为？

编辑：这是我的源代码：

<table data-toggle="table"
  data-url="working-url.php"
  class="table table-borderless table-striped">
  <thead>
    <tr>
      <th scope="col-2" data-field="statistic">Statistic</th>
      <th scope="col-2" data-field="value">Value of Stat</th>
    </tr>
  </thead>
</table>

但是当我加载页面然后检查元素时，我得到了这个：

<table data-toggle="table" 
  data-url="working-url.php" 
  class="table table-borderless table-striped table-bordered table-hover"> 
  ...
</table>

【问题讨论】：

你能为此分享 HTML 吗？如果生成新行，也会自动添加table-bordered。您可以使用 jQuery 或 Javascript 从表中手动删除它。告诉我。
@AlwaysHelping 我添加了 HTML，但如果 table-bordered 自动添加到新行，那么我想我只需要手动更改它。呃，好吧。谢谢！
您在手动删除课程方面需要帮助吗？喜欢 jQuery 或 JS 帮助
@AlwaysHelping 那太好了，谢谢！
在下面查看我的工作解决方案。不要忘记投票并接受作为“答案”。谢谢

标签： javascript html css bootstrap-table

【解决方案1】：

她是通过引导程序 4 添加的数据中removeClass() 的有效方法。

您可以使用JS 或jQuery。

只需在下面运行 sn-p 即可查看它的作用。您可以将以下 JS 或 jQuery 代码添加到您的表中以手动删除您不想要的类。

另外，我在您的表中添加了一个名为 my_table 的 ID，这是为了确保我们只从一个表中删除类 table-bordered，而不是您页面上的每个表 - 如果有的话

//jQuery//
$('#my_table').removeClass('table-bordered')

//Javascript Version//
var element = document.getElementById("my_table");
element.classList.remove("table-bordered");

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>

<table data-toggle="table" data-url="working-url.php" class="table table-borderless table-striped table-bordered table-hover" id="my_table">
  <thead>
    <tr>
      <th scope="col-2" data-field="statistic">Statistic</th>
      <th scope="col-2" data-field="value">Value of Stat</th>
    </tr>
  </thead>
</table>

希望这会有所帮助。

【讨论】：