js正文内容高亮效果的实现方法
js正文内容高亮效果的实现方法
发布时间:2016-12-30 来源:查字典编辑
摘要:复制代码代码如下://高亮显示搜索到的关键字functionHeightLight(Keyword){//文本选择器varTextRange...

复制代码 代码如下:

//高亮显示搜索到的关键字

function HeightLight(Keyword)

{

//文本选择器

var TextRange;

//是否找到

var Found=false;

//找到的次数

var Count = 0;

TextRange = document.body.createTextRange();

Found = TextRange.findText(Keyword);

if (Found)

{

Count++;

}

while (Found && Count > 0)

{

TextRange.pasteHTML('<span>' + Keyword + '</span>');

//将滚动条定位到第一次查到的视口范围内

if(Count==1)

{

TextRange.scrollIntoView();

}

//继续查找

Found = TextRange.findText(Keyword);

if (!Found)

{

Count = 0;

}

else

{

Count++;

}

}

}

//正则式法

function highLight(ele,keys)

{

var reg = new RegExp("(" + keys.replace(/,/,"|") + ")","g");

ele.innerHTML = ele.innerHTML.replace(reg,"<font color="red">$1</font>");

}

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类