继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

js实现查找关键字效果

qaytix
关注TA
已关注
手记 104
粉丝 37
获赞 165

<!DOCTYPE html>

<html>

<head>

<title>http://www.cnblogs.com/web001/p/8260684.html</title>

<meta charset="utf-8"/>

<style type="text/css">

p { border:5px solid #ccc; background:#FFFF99; width:400px; padding:20px; font-size:16px;  }

        span { background:red; }

</style>

</head>

<body>

<div>

<input type="text" id="content" />

    <input type="button" value="查找" id="btn"/>

    <p id="box">

        轻轻的我走了,正如我轻轻的来;我轻轻的招手,作别西天的云彩。<br/>

        那河畔的金柳,是夕阳中的新娘;波光里的艳影,在我的心头荡漾。<br/>

        软泥上的青荇,油油的在水底招摇;在康河的柔波里,我甘心做一条水草! <br/>

        那榆荫下的一潭,不是清泉,是天上虹;揉碎在浮藻间,沉淀着彩虹似的梦。<br/>

        寻梦?撑一支长篙,向青草更青处漫溯;满载一船星辉,在星辉斑斓里放歌。<br/>

        但我不能放歌,悄悄是别离的笙箫;夏虫也为我沉默,沉默是今晚的康桥!<br/>悄悄的我走了,正如我悄悄的来;我挥一挥衣袖,不带走一片云彩

    </p>

</div>

</body>



</html>

<script type="text/javascript">

var content=document.getElementById('content');

var btn=document.getElementById("btn");

var box=document.getElementById("box");


btn.=function(){

var getValue=content.value;

if(!getValue){

return;

}

box.innerHTML=box.innerHTML.split(getValue).join('<span>'+getValue+'</span>');

}


</script>


打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP