JavaScript——页面指定字符或字符串高亮显示的方法

最新推荐文章于 2024-05-19 10:57:04 发布

Mickey_于浩

最新推荐文章于 2024-05-19 10:57:04 发布

阅读量1w

点赞数 2

分类专栏： JavaScript 文章标签： javascript 高亮文章高亮高亮显示某字符高亮

本文链接：https://blog.csdn.net/yu17310133443/article/details/77008322

版权

JavaScript 专栏收录该内容

17 篇文章 0 订阅

订阅专栏

在很多地方，例如搜索关键字，我们需要将结果中的匹配的关键字高亮显示出来，我们可以用下面的方法来实现

例如：将诗中的“的”字全部显示橘黄色

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<div id="content">
		<p>又一个清晨</p>
		<p>如昨天一般下着小雨</p>
		<p>我撑着伞</p>
		<p>走在每天必经的路上</p>
		<p>汽车发动机的声音</p>
		<p>车轮辗过水洼的声音</p>
		<p>周围人走路的声音</p>
		<p>一切都如往常一样</p>
		<p>却都没有此时</p>
		<p>显得那么悦耳动听</p>
		<p>就连潮湿的空气</p>
		<p>也是那么的好闻</p>
		<p>深吸一口</p>
		<p>感觉自己的内心</p>
		<p>得到一丝从未有过的安宁</p>
		<p>汽车的一声鸣笛</p>
		<p>就像向湖面扔了一粒石子</p>
		<p>将我从梦中惊醒</p>
		<p>发现自己依然身处在</p>
		<p>这霾雾重重嘈杂烦乱的城市中</p>
	</div>
</body>
<script>
	var content = document.getElementById("content").innerHTML;
	var s = "的";
    var reg = new RegExp("(" + s + ")", "g");  
    var str = content;  
    var newstr = str.replace(reg, "<font color=#FF6633>$1</font>");
	document.getElementById("content").innerHTML = newstr;
</script>
</html>

Mickey_于浩

关注

2
点赞
踩
8

收藏

觉得还不错? 一键收藏
打赏
5
评论
JavaScript——页面指定字符或字符串高亮显示的方法

在很多地方，例如搜索关键字，我们需要将结果中的匹配的关键字高亮显示出来，我们可以用下面的方法来实现例如：将诗中的“的”字全部显示橘黄色 Document 又一个清晨如昨天一般下着小雨我撑着伞走在每天必经的路上汽车发动机的声音车轮辗过水洼的声音周围人走路的声音一切都如往常一样却都没有此时显得那么悦耳动听
复制链接

扫一扫