东方星雨

简单网络

一个爱好网络的80后男站长。

关注我东方星雨个人微信号:476847113

您现在的位置是:首页 > 站长日志

利用JS高亮显示页面的字,一般试用于搜索

2018-10-14 站长 站长日志

今天上班累了,在网上瞎逛下,看到这个代码,很不错,拿来用用:
-------------------------------------------------------------
用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代码包含的!

文章评论