关键字检索高亮标出-javasript/jQuery代码实现

最新推荐文章于 2022-06-22 17:19:09 发布

Java我人生

最新推荐文章于 2022-06-22 17:19:09 发布

阅读量8.2k

点赞数 2

分类专栏： jQuery javascript 文章标签：检索关键字 javascriptjquery 高亮显示关键字文章关键字高亮显示检索文章关键字

本文链接：https://blog.csdn.net/chenleixing/article/details/45216675

版权

这篇博客分享了一种使用JavaScript和jQuery实现关键字检索并高亮显示的方法。通过传入HTML元素ID和关键字，代码能高亮显示文章中的检索关键字。如果关键字来自网页编辑器，需要注意textarea的处理方式。此外，文章还提到了正则表达式的重要性，并推荐了相关正则表达式的学习资源。

摘要由CSDN通过智能技术生成

此方法传入2个参数，一个是被检索内容所在的表单或者HTML元素的ID，另一为关键字，多个关键字的话，以空格隔开，下边直接上代码分享给大家：

/*关键词检索高亮标出
 *param idHtmlContent 需要检索的HTML内容ID
 *param keyword 关键字，多个以空格隔开
 */
function keywordHighlight(idHtmlContent,keyword) {
	var content= $("#"+idHtmlContent).html();//获取内容
	if ($.trim(keyword)==""){
		return;//关键字为空则返回
	}
	var htmlReg = new RegExp("\<.*?\>", "i");
	var arrA = new Array();
	//替换HTML标签
	for (var i = 0; true; i++) {
		var m = htmlReg.exec(content);
		if (m) {
			arrA[i] = m;
		}else {
			break;
		}
		content = content.replace(m, "{[(" + i + ")]}");
	}
	words = unescape(keyword.replace(/\+/g, ' ')).split(/\s+/);
	//替换关键字 
	for (w = 0; w < words.length; w++) {
		var r = new RegExp(&#