本文详解为何 jQuery 动态添加 bg-success 等 Bootstrap 背景类失效，并提供根本性解决方法：覆盖 Bootstrap 表格默认背景变量 --bs-table-bg。
本文详解为何 jquery 动态添加 `bg-success` 等 bootstrap 背景类失效，并提供根本性解决方法：覆盖 bootstrap 表格默认背景变量 `--bs-table-bg`。
在使用 jQuery 动态为 Bootstrap 表格行（如 <tr>）添加 <code>bg-success、bg-warning 或 bg-danger 类时，你可能会发现样式始终未生效——即使 DOM 中已成功添加对应 class，浏览器开发者工具也显示该类存在，但背景色却“看不见”。这并非 jQuery 逻辑错误，而是 Bootstrap 5+ 的 CSS 优先级机制导致的典型问题。
根本原因在于：Bootstrap 表格（ ✅ 正确解决方案是重置 Bootstrap 的表格背景变量，而非尝试用 ⚠️ 注意：不要设为 完成此配置后，你的原有 jQuery 逻辑即可正常工作： 至此，平均分达标后表格行将按预期呈现红/黄/绿三色状态，逻辑与视觉完全一致。.table）组件默认启用了内建背景色控制变量 --bs-table-bg，其初始值（如 #fff 或 var(--bs-body-bg)）会通过 background-color: var(--bs-table-bg) *强制覆盖 <tr> 元素上由 `bg-<code>工具类设置的背景色**。由于该声明位于.table > tbody > tr的继承链中且具有更高特异性（或变量级联优先级），直接为
添加bg-success` 无法突破这一限制。!important 强行覆盖：/* 在你的自定义 style.css 中添加 */
.table {
--bs-table-bg: transparent;
}
none（CSS 中 background-color: none 是无效值），应使用 transparent 或 unset。transparent 更安全，确保无背景干扰。function updateResultsTable() {
$.each(answersData, function (pitanje, podaci) {
const srednjaVrednost = podaci.brOdgovora > 0
? (podaci.ukupnaOcena / podaci.brOdgovora).toFixed(2)
: 0;
const rowIndex = pitanje.slice(-1);
$(`#prosecnaOcena${rowIndex}`).text(srednjaVrednost);
const row = $(`#row${rowIndex}`);
// 清除旧状态类（推荐使用 toggleClass 或一次性移除）
row.removeClass("bg-danger bg-warning bg-success");
if (srednjaVrednost <p>? 额外建议：</p>
<tr> 不被其他 CSS 规则（如 <code>.table-striped 的奇偶行着色）干扰，必要时可对 .table 添加 border-collapse: separate 或检查 background-clip；@media (prefers-color-scheme: dark) 进一步定制变量；
