如何给给关键词 高亮?

我现在想给 页面上的一段文本 遍历并高亮元素。
效果如下:

之前做法,是直接用正则 ,即带着标签和文本一起匹配,但这样有一个问题 ,就是如果关键字在html标签中存在,例如 关键字‘as’ ,一定会命中当前元素中的 “class=""”,造成页面混乱。

如果不用正则,直接replace文本, 例: $(this).html($(this).replace("例子","<span class="highLight">例子</span>));虽然有效,但是 职能替换收个出现的元素,不能替换所有 ,我也不太清楚是否有能替换所有的函数(除了正则)

后来我改进了,我直接把所有的元素的文本先都取出来,对着文本一通改,这样能保证一定匹配对,匹配完整,但是问题是,如果这个dom结构是个多层级的嵌套,把匹配的结果在打上原来的标签又是一件麻烦事,我索性就自定义他们的标签,来完成展示。我知道这样肯定也不合理。

后来我又尝试 按照 文本的标签(p span div)来匹配,意思就是把大段文本 拆成单个元素,分别匹配,当我觉得这样更加合理和可靠时,我又发现问题:我们的数据是爬下来的,所以格式又不是特别统一,各种各样格式,如:<p>2222222222<br>333333</p>这样的及时按照p标签来匹配,222222333333肯定就连贯起来了,页面效果也就由原来的换行-->现在不换行,而且没法<爱尬聊_百科网>判断还有未知的其他格式

有没有人给下解决思路。


123457245 8小时前

大概流程就是这样,我没有测试过,但这个思路肯定是可行的,具体细节你自己捣鼓捣鼓。


Anla0617 8小时前

先使用replace,正则替换html标签<>(可能有点复杂),replace好像有回调函数,每次替换不同的内容,同时保存替换内容(特殊格式)和被替换内容(html标签)到集合obj;


zhouyuanhuei 8小时前

replace的里面可以写正则


贡幼旋 8小时前

替换后的内容使用replace替换高亮内容;


墨小白掩饰不了的爱被爱删除蝶霜 8小时前

为什么不在当初写文章的时候就标记好这些格式……


健康最重要2015 8小时前

lucene


编辑 举报 2023-06-15 14:26

0个评论

暂无评论...
验证码 换一张
相关内容