请求修改JS代码:将高亮重复单词改为高亮重复数字
修改代码以高亮表格中的重复数字
以下是修改后的完整代码,可实现高亮表格中重复出现的数字(支持整数和小数):
var text = $('table'); var arr = []; // Step 1: 提取表格中所有数字 text.each(function(){ // 匹配所有整数和小数,无匹配时返回空数组 let nums = $(this).text().match(/\d+(\.\d+)?/g) || []; arr.push(...nums) }) console.log("arr", arr) // Step 2: 找出重复的数字 let duplicate = arr.filter(function(value, index, self){ // 判断是数字且重复出现 return !isNaN(parseFloat(value)) && self.indexOf(value) !== index; }) // 去重,避免同一数字被多次标记 duplicate = [...new Set(duplicate)]; console.log("duplicate", duplicate) // Step 3: 在表格单元格中标记重复数字 $('td').each(function(){ let html = $(this).html(); const openMark = '<mark>'; const closeMark = '</mark>'; duplicate.forEach(num => { // 用正则边界匹配完整数字,避免部分匹配 const regex = new RegExp(`\\b${num}\\b`, 'g'); html = html.replace(regex, `${openMark}$&${closeMark}`); }) $(this).html(html); })
关键修改说明
- 提取逻辑调整:放弃原按空格拆分单词的方式,改用正则
/\d+(\.\d+)?/g精准提取所有数字(包含小数),确保只处理目标内容。 - 重复判断反转:原代码过滤掉数字,现在改为只保留数字且判断重复;新增Set去重,避免同一个数字被重复标记。
- 标记精准性优化:用带单词边界的正则替换,避免部分匹配(比如不会把"123"中的"12"误标记);一次性替换单元格HTML,避免嵌套
<mark>标签的问题。
内容的提问来源于stack exchange,提问作者M7md Abdallah
相关产品推荐
相关产品推荐

