JavaScript动态创建表格：表头文本加粗方法失效求助

我来帮你搞定这个表头加粗的问题～先说说你之前踩的坑：

1. 为什么.bold()没用？
   这个方法是早期的DOM API，它返回的是带<b>标签的字符串（比如"<b>Type</b>"），但你用document.createTextNode()会把这些标签当成纯文本内容插入，浏览器不会解析成HTML元素，所以只会显示带标签的文本，不会真的加粗。

2. 为什么titlerow[k].style.fontWeight = 'bold'没用？
   titlerow[k]是字符串类型，字符串根本没有style属性，这行代码相当于给一个不存在的属性赋值，自然不会有任何效果。

下面给你三种可行的解决方案，按需选择：

方案一：使用语义化的<th>元素（推荐） #

表格表头本来就应该用<th>标签，浏览器默认会给<th>应用加粗样式，同时语义更准确：

var table = document.getElementById('changestable'); 
var titlerow = ["Type", "Change Date", "FCM", "Hull ID", "Name", "Length", "Manufacturer", "Manufacturer ID", "Year", "Value", "Owner", "Loss Payee", "Policy ID", "Start Date", "End Date"]; 
var newRow = table.insertRow(0); 

for (let k = 0; k < titlerow.length; k++){ 
    // 创建<th>代替<td>，语义化且默认加粗
    var newCell = document.createElement('th'); 
    var newText = document.createTextNode(titlerow[k]); 
    newCell.appendChild(newText); 
    newRow.appendChild(newCell); 
}

如果默认样式不符合需求，还可以给<th>自定义样式，比如newCell.style.fontWeight = '700'（更细粒度控制加粗程度）。

方案二：直接给单元格设置CSS样式 #

如果坚持用<td>，可以直接给单元格元素添加加粗样式：

var table = document.getElementById('changestable'); 
var titlerow = ["Type", "Change Date", "FCM", "Hull ID", "Name", "Length", "Manufacturer", "Manufacturer ID", "Year", "Value", "Owner", "Loss Payee", "Policy ID", "Start Date", "End Date"]; 
var newRow = table.insertRow(0); 

for (let k = 0; k < titlerow.length; k++){ 
    var newCell = newRow.insertCell(k); 
    var newText = document.createTextNode(titlerow[k]); 
    newCell.appendChild(newText); 
    // 给单元格设置加粗样式
    newCell.style.fontWeight = 'bold'; 
}

这种方式适合需要灵活控制样式的场景，比如同时修改字体颜色、背景色等。

方案三：用<strong>标签包裹文本 #

如果想让文本本身被语义化的加粗标签包裹（<strong>比<b>更推荐，因为它有强调的语义），可以创建<strong>元素再插入到单元格中：

var table = document.getElementById('changestable'); 
var titlerow = ["Type", "Change Date", "FCM", "Hull ID", "Name", "Length", "Manufacturer", "Manufacturer ID", "Year", "Value", "Owner", "Loss Payee", "Policy ID", "Start Date", "End Date"]; 
var newRow = table.insertRow(0); 

for (let k = 0; k < titlerow.length; k++){ 
    var newCell = newRow.insertCell(k); 
    var boldElement = document.createElement('strong'); 
    var newText = document.createTextNode(titlerow[k]); 
    boldElement.appendChild(newText); 
    newCell.appendChild(boldElement); 
}

另外小建议：尽量用let代替var来声明循环变量k，避免变量提升导致的作用域问题哦～

内容的提问来源于stack exchange，提问作者dataviews