像百度那样把所有页面中的关键字都变成红色怎样实现？（答者有分）

zqtoo 2009-12-24 10:33:50

本人做了一个站内搜索，想像百度那样把所有页面中的关键字都变成红色

通过JavaScript实现。。。

...全文

486 19 打赏收藏举报

写回复

19 条回复

切换为时间正序

请发表友善的回复…

发表回复

zqtoo 2009-12-25

打赏
举报

对呀这倒是个大问题

zqtoo 2009-12-24

打赏
举报

sohighthesky 大哥的也好

zqtoo 2009-12-24

打赏
举报

再次感谢各位！

sohighthesky 2009-12-24

打赏
举报

忘记加括号了



var content = document.body.innerHTML;

var key = ["中国","日本"];//可以1个，可以多个

content = content.replace(new RegExp("("+key.join("|")+")","g"),"<font color=blue>$1</font>");

document.body.innerHTML = content;

浪尖赏花 2009-12-24

打赏
举报

[Quote=引用 11 楼 zqtoo 的回复:]
谢谢 lihui_shine 大哥谢谢大家 ok了不过请问 lihui_shine 大哥eval()是什么意思，有什么用？
[/Quote]
eval就是执行一个JS语句，eval("/(中国|日本)/g");将获得一个正则

sohighthesky 2009-12-24

打赏
举报



var content = document.body.innerHTML;

var key = ["中国","日本"];//可以1个，可以多个

content = content.replace(new RegExp(key.join("|"),"g"),"<font color=blue>$1</font>");

document.body.innerHTML = content;

zqtoo 2009-12-24

打赏
举报

10楼das_jack的也很强大

zqtoo 2009-12-24

打赏
举报

谢谢 lihui_shine 大哥谢谢大家 ok了不过请问 lihui_shine 大哥eval()是什么意思，有什么用？

das_jack 2009-12-24

打赏
举报

//css
.key_word{font-color:red;}
//js
/*
*@where is element where to search the keywords
*@keys_arr is the keywords array
*@stylename is the css class name
*/
function sign_keywords(where,keys_arr,stylename)
{
var content = where.innerHTML;
var keyswords = '('+keys_arr.join('|')+')';
var regex = new RegExp(keyswords, 'g');
content = content.replace(regex,'$1');
where.innerHTML = content;

}
sign_keywords(your_element,['i','a','w'],'hover');

浪尖赏花 2009-12-24

打赏
举报

[Quote=引用 7 楼 zqtoo 的回复:]
问题就是我的key是个变量
[/Quote]

<html>



<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>test</title>

</head>



<body>

中国美国日本





台湾

</body>

<script>

var content = document.body.innerHTML;

var key = ["中国","日本"];//可以1个，可以多个

var str = "";

for(var i=0;i<key.length;i++){

if(str!="")str+="|";

str += key[i];

}

content = content.replace(eval("/("+str+")/g"),"<font color=blue>$1</font>");

document.body.innerHTML = content;

</script>

</html>

真哥哥 2009-12-24

打赏
举报

1楼很强悍啊！

zqtoo 2009-12-24

打赏
举报

问题就是我的key是个变量

wbhggwk 2009-12-24

打赏
举报



document.documentElement.innerHTML.replace(/your keyword reg/, "<font color='red'>"+your keyword+"<font>");

zqtoo 2009-12-24

打赏
举报

我的key是个变量 (/(中国|日本)/g 这里不知道这么改

zqtoo 2009-12-24

打赏
举报

我是这样写的但只替换了第一个后面的没变
var key = document.getElementById("txtKey").value;
var html = document.getElementById("context").innerHTML;
html = html.replace(key, " " + key + "");
document.getElementById("context").innerHTML = html;
不用js也行能实现就行就是最好

浪尖赏花 2009-12-24

打赏
举报

上面颜色变错了，LZ改下吧
content = content.replace(/(中国|日本)/g,"$1");

浪尖赏花 2009-12-24

打赏
举报

<html>



<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>test</title>

</head>



<body>

中国美国日本





台湾

</body>

<script>

var content = document.body.innerHTML;

content = content.replace(/(中国|日本)/g,"<font color=blue>$1</font>");

document.body.innerHTML = content;

</script>

</html>