利用JS高亮顯示頁面的字，一般試用于搜索

2024-09-06 12:41:07

字體：大中小

來源：轉載

供稿：網友

今天上班累了，在網上瞎逛下，看到這個代碼，很不錯，拿來用用：
-------------------------------------------------------------
用JS讓文章內容指定的關鍵字加亮
是這樣的..
<a href='#'>當在文章里頭出現這些關鍵字："文章、關鍵、功能",就把它加亮顯示..</a>
<script language='JavaScript'>
function highlight(key)
{
var key = key.split('|');
for (var i=0; i<key.length; i++)
{
var rng = document.body.createTextRange();
while (rng.findText(key[i]))
//rng.pasteHTML(rng.text.fontcolor('red'));
rng.pasteHTML('<span "color:#F00">' + rng.text + '</span>');
}
}
highlight('文章|關鍵|功能')
</script>
紅色的字就是您要高亮的內容
PS：這個方法也坑爹，不兼容非IE核心的瀏覽器！
當頁面有某些字要高亮顯示，并且顯示不同的顏色的時間用：
<script language='JavaScript'>
function highlight(key)
{
var color='';
if(key=='優秀')
color='#F00';
if(key== '良好')
color='#000';
document.write('<span "color:'+color+'">' + key + '</span>');
}
</script>

<p>節奏感：<script type="text/javascript">highlight('優秀');</script></p>
<p>音感：<script type="text/javascript">highlight('良好');</script></p>

這個倒是兼容的但是js代碼必須放在前面，并且這個只是適合一些特定的情況。不適合搜索，因為要高亮的字是用js代碼包含的！

上一篇：最簡單JS代碼實現鼠標移入顯示二維碼

下一篇：簡單高效的按照不同時間段顯示不同的廣告JS方法！