提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  前端

当前栏目

javascript高亮效果的二种实现方法

JavaScript方法 实现 效果 高亮 二种
2023-06-13 09:14:02 时间
js高亮方法一：
复制代码代码如下:

<script>
functionHighLight(nWord){

if(nWord!=""){

varkeyword=document.body.createTextRange();

while(keyword.findText(nWord)){

keyword.pasteHTML("<spanstyle="color:red;">"+keyword.text+"</span>");

keyword.moveStart("character",1);

}

}

}

functionhighword(nWord){

vararray=nWord.split(",");

for(vari=0;i<array.length;i++){

HighLight(array[i]);

}

}
</script>


<bodyonload="highword("li,jin")">

<p>liujinzhongliujinzhongliuzhong</p>

</body>


js高亮方法二：

2.
复制代码代码如下:

<html>
<head>
<title>TestPage</title>
<scripttype="text/javascript">
<!--
functionhighLight(ele,keys)
{
varreg=newRegExp("("+keys.replace(/,/,"|")+")","g");

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

window.onload=function()
{
highLight(document.getElementsByTagName("p")[0],"li,jin");
}
//-->
</script>
</head>

<body>
<p>liujinzhongliujinzhongliuzhong</p>
</body>
</html>

相关文章