JavaScript动态构建表格时单个单元格文本加粗失效如何解决
2026-10-10
问题原因
你遇到的不生效问题来自两处语法错误+潜在的样式覆盖问题：
- 直接给
style对象赋值字符串属于不规范写法，会直接覆盖你之前设置的backgroundColor属性，且标准的行内样式设置方式是操作style对象下的对应属性 - 你在
innerHTML中使用了模板变量语法${}，但外层用的是普通双引号而非模板字符串专属的反引号（），导致变量无法被正确解析，此外如果全局CSS重置了标签的默认粗体样式，也会导致嵌入`的方案失效
修正后代码
var cell21 = row.insertCell(0); cell21.colSpan = 3; cell21.style.backgroundColor = colour; // 标准写法设置粗体，优先级高于标签默认样式 cell21.style.fontWeight = 'bold'; // 改用反引号包裹模板字符串，无需额外加<b>标签 cell21.innerHTML = `${researchpapers[counter][2]}`;
异常排查
如果修改后还是不生效，可以按以下顺序检查：
- 排查全局CSS是否针对
td元素设置了font-weight: normal !important这类带!important的强制样式，优先级高于普通行内样式，这种情况可以把样式设置改为cell21.style.fontWeight = 'bold !important' - 确认
researchpapers[counter][2]变量取值正常，避免变量为空导致看不到样式效果
内容的提问来源于stack exchange，提问作者RobM
相关产品推荐
相关产品推荐
