jquery如何在td中加粗部分文本而不是整體？

Question

<td> ABCDE </td> 

$("td:contains('CD')").css("font-weight","Bold"); 

這將大膽的全部文本，如：ABCDE。我怎樣才能加粗文字CD如「AB CD E」？

Answer 1

使用使用HTML標記的文本替換，但你需要指定要替換的文字：

$("td:contains('CD')").each(function(td,item){ 
    $(item).html($(item).html().replace("CD","<b>CD</b>")) 
}); 

見https://jsfiddle.net/qo5zxx9a/

另一種解決方案是使用HTML標記寫的單元格內容：

<td>AB<span class="bold">CD</span>E</td> 

Answer 2

以下是一個基於此answer的示例。

function highlight(word, element) { 
 
    var rgxp = new RegExp(word, 'g') 
 
    var repl = '<span class="bold">' + word + '</span>' 
 
    element.innerHTML = element.innerHTML.replace(rgxp, repl) 
 
} 
 

 
var element = document.querySelector('td') 
 
highlight('CD', element)

.bold { 
 
    font-weight: bold; 
 
}

<table> 
 
    <td> ABCDE </td> 
 
</table>