JS实现文本中查找并替换字符

效果图：

代码如下，复制即可使用：

<!DOCTYPE html><html>
<head><style type="text/css">*{font-family:"微软雅黑";font-size:16px;margin:0;padding:0;letter-spacing:3px;line-height:22px;}#wrap{width:500px;height:300px;margin:20px auto;position:relative;}#text{width:500px;height:300px;border:1px solid green;}#result{width:500px;position:absolute;left:0px;top:0px;display:none;}input{width:100px;height:40px;margin-top:5px;}span{background-color:yellow;}</style>
</head>
<body><div id="wrap"><div id="result"></div><textarea id="text" placeholder="请在此输入文本。。。。"></textarea><input type="text" id="val" placeholder="被查找字符"/>——<input type="text" id="new_val" placeholder="替换后字符"/>&nbsp;&nbsp;&nbsp;<input type="button" id="btnFind" value="替换"/>&nbsp;&nbsp;&nbsp;<input type="button" value="重置" id="reset"/></div><script type="text/javascript">function replace(){var inner=null;var txt=document.getElementById('text').value.toString();var val=document.getElementById('val').value.toString();var newVal=document.getElementById('new_val').value.toString();newInner="<span>" newVal "</span>";for(var i=0;i<=txt.length-val.length;i  ){if(txt==""||val=="") {alert("请输入内容！");return false;}if(txt.length<val.length) {return false;}if(i val.length>=txt.length){if(txt.substring(i)==val){inner=txt.split('');inner.splice(i,val.length,newInner);txt=inner.join("");i=i newInner.length-1;}}else {if(txt.substring(i,i val.length)==val) {inner=txt.split('');inner.splice(i,val.length,newInner);txt=inner.join("");i=i newInner.length-1;}}}document.getElementById("result").innerHTML=txt;document.getElementById("text").value=null;document.getElementById("text").placeholder="";document.getElementById("result").style.display="block";}document.getElementById('btnFind').onclick=function(){replace();}document.getElementById('reset').onclick=function(){document.getElementById("result").style.display="none";document.getElementById("val").value=null;document.getElementById("new_val").value=null;document.getElementById("text").placeholder="请在此输入文本。。。。";}</script>
</div>
</body>
</html>

如有错误，欢迎联系我改正，非常感谢！！！

更多专业前端知识，请上【猿2048】www.mk2048.com

JS实现文本中查找并替换字符相关推荐

Excel 中查找和替换字符
最近一两个月,处理了大量的Excel表格,具体的目标包括筛选出包含特定字符串的行,查找某个值是否在表中存在等.工作中积累了大量使用Excel的经验,想记下来,却一直没有时间.今天促成动笔因素的还是因为 ...
如何在Excel中查找和替换文本和数字
查找和替换工具是 Excel 的一个强大但经常被遗忘的功能.让我们看看如何使用它来查找和替换电子表格中的文本和数字,以及它的一些高级功能. 在 Excel 中查找和替换文本和数字处理大型电子表格时, ...
Microsoft Excel 教程：如何在 Excel 中查找或替换工作表上的文本和数字？
欢迎观看 Microsoft Excel 教程,小编带大家学习 Microsoft Excel 的使用技巧,了解如何在 Excel 中查找或替换工作表上的文本和数字. 在 Excel 中使用「查找和替 ...
在Python中查找和替换文本，玩转Python正则
最简单的查找替换在Python中查找和替换非常简单,如果当前对象是一个字符串str时,你可以使用该类型提供的find() 或者index() 方法查找指定的字符,如果能找到则会返回字符第一次出现的索 ...
Microsoft Word 教程：如何在 Word 中查找和替换文本？
欢迎观看 Microsoft Word 教程,小编带大家学习 Microsoft Word 的使用技巧,了解如何在 Word 中查找和替换文本. 如果处理大量文本,并需要搜索替换某个单词或短语,可使用 ...
python字符串之查找与替换_在Python中查找和替换文本
最简单的查找替换在Python中查找和替换非常简单,如果当前对象是一个字符串str时,你可以使用该类型提供的find()或者index()方法查找指定的字符,如果能找到则会返回字符第一次出现的索引, ...
Microsoft Word 教程「2」，如何在 Word 中查找和替换文本？
欢迎观看 Microsoft Word 教程,小编带大家学习 Microsoft Word 的使用技巧,了解如何在 Word 中查找和替换文本. 如果处理大量文本,并需要搜索替换某个单词或短语,可使用 ...
Word中查找和替换功能详细介绍
在Word中查找和替换功能很多人都会使用,最通常是用它来查找和替换文字,但实际上还可用查找和替换格式.段落标记.分页符和其他项目,并且还可以使用通配符和代码来扩展搜索. 一.查找和替换文字例如:将& ...
excel 替换换行符_在Excel中查找和替换换行符
excel 替换换行符 When you want to create a line break (line feed) in a cell, you press Alt + Enter, to s ...

JS实现文本中查找并替换字符

JS实现文本中查找并替换字符相关推荐

最新文章

热门文章