JS技术

运用JS将搜索的关键字高亮显示

字号+ 作者: 来源:IT168    2014-11-17 20:00 我要评论( )

用JS让文章内容指定的关键字加亮 是这样的.. 现在有这些关键字:美容,生活,购物 当在文章里头出现这些关键字,就把它加亮显示.. 文章是生成静态页面的,而这些关键字是能随时更新的,所以我想用JS来实现... 不知道怎样来实现这样的功能啊?特此求助 /pre script l

用JS让文章内容指定的关键字加亮


是这样的..

现在有这些关键字:美容,生活,购物
当在文章里头出现这些关键字,就把它加亮显示..

文章是生成静态页面的,而这些关键字是能随时更新的,所以我想用JS来实现...
不知道怎样来实现这样的功能啊?特此求助
</pre>

<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('<div style="border:1 solid red;display:inline"><a href="#" title="+ rng.text +">' + rng.text + '</a></div>');
 }
}
highlight('文章|关键|功能')
</script>
 

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 【OpenCV入门教程之三】 图像的载入,显示和输出 一站式完全解析 - 【C++游戏编程】微软最有价值专家—毛星云(浅

    【OpenCV入门教程之三】 图像的载入,显示和输出 一站式完全解析 -

    2015-12-13 10:14

  • Javascript实例教程(9) 随机显示图片_javascript教程教程

    Javascript实例教程(9) 随机显示图片_javascript教程教程

    2015-10-09 19:04

  • 显示客户端页面执行时间的代码_javascript教程教程

    显示客户端页面执行时间的代码_javascript教程教程

    2015-10-08 13:15

  • JScript中正则表达式用法详解(附例子:JScript做语法加亮显示) _javascript教程教程

    JScript中正则表达式用法详解(附例子:JScript做语法加亮显示) _java

    2015-10-08 13:13

网友点评
s