javascript - 将html添加到某个字符之前的所有内容

Question

好吧，这是在黑暗中真实拍摄的，不太确定我的标题措辞是否正确，但我想做的是如下:

我有一个看起来像这样的 html 表格

<table>
   <tr>
      <td>Type: Tanker </td>
      <td>DWT: 8672.82 </td>
   </tr>
   <tr>
      <td>Flag: Gibraltar</td>
      <td>Pumping Capacity: 12 Cargos pumps each 200m3/h </td>
   </tr>
</table>

我想做的是动态地将所有内容“标题”包装在“:”之前，这样表格看起来如下

<table>
   <tr>
      <td><strong>Type:</strong> Tanker </td>
      <td><strong>DWT:</strong> 8672.82 </td>
   </tr>
   <tr>
      <td><strong>Flag:</strong> Gibraltar</td>
      <td><strong>Pumping Capacity:</strong> 12 Cargos pumps each 200m3/h </td>
   </tr>
</table>

我知道我可以通过在表格中再添加两列并使用 css :first-child 和 nth-child 选择器来轻松实现这一点，但由于大小/布局限制，这不是我想要这样做的方式.

Answer 1

你可以像这样轻松地做到这一点:

$('td').html(function(_,h){
    return h.replace(/([^:]+):/, '<strong>$1:</strong>')
});

Demonstration