用html+javascript打造公文一键排版系统12:删除附件说明中“附件:”里的空格

如果我们在输入附件说明时在"附件:"之间加入空格,那么排版时就要删除这些空格。

因为string对象replace()支持正则表达式,于是考虑用replace()来完成。

写了一段只有一个多余空格的代码来测试:

html 复制代码
<!DOCTYPE HTML>
<HTML>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="Author" content="PurpleEndurer">
	<title>公文一键排版系统</title>
</head>
<body>
<script>
var s = ["附 件:河池市××关于××××××××××××××××××××××××××××××××××××××××××××××××××的通知",
	"附件:河池市××关于××的通知",
    "附件:河池市××关于××的通知。"
	];

for (var i=0; i < s.length; i++)  
{
	document.write(s[i].replace(/附\s件:/,'附件:')+"<br>");  

}
</script>
</body>
</html>

运行结果如下:

附件:河池市××关于××××××××××××××××××××××××××××××××××××××××××××××××××的通知

附件:河池市××关于××的通知

附件:河池市××关于××的通知。

增加了包括多个多余空格的测试样本,同时修改正则表达式,分别用三种方法来检测:

html 复制代码
<!DOCTYPE HTML>
<HTML>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="Author" content="PurpleEndurer">
	<title>公文一键排版系统</title>
</head>
<body>
<script>
var s = ["附 件:河池市××关于××××××××××××××××××××××××××××××××××××××××××××××××××的通知",
	"附   件  : 河池市×   ×关于××××××××××××××××××××××××××××××××××××××××××××××××××的通知",         
	"附件:河池市××关于××的通知",
    "附件:河池市××关于××的通知。"
	];

document.write("<br>方法1.----------<br>");  

for (var i=0; i < s.length; i++)  
{
  //document.write(s[i].replace(/附\s件:/,'附件:')+"<br>"); 
  document.write(s[i].replace(/附\s*件\s*(:|:)\s*/g,'附件:'),"<br>");  
}

document.write("<br>方法2.----------<br>");  

for (var i=0; i < s.length; i++)  
{
	document.write(s[i].replace(/\s/g,''),"<br>");
}

document.write("<br>方法3.----------<br>");  

for (var i=0; i < s.length; i++)  
{
	document.write((s[i].substring(0,s[i].indexOf(':')+1)).replace(/\s/g,''),s[i].substring(s[i].indexOf(':')+1),"<br>");
}

</script>
</body>
</html>

运行结果如下:

方法1.----------

附件:河池市××关于××××××××××××××××××××××××××××××××××××××××××××××××××的通知

附件:河池市× ×关于××××××××××××××××××××××××××××××××××××××××××××××××××的通知

附件:河池市××关于××的通知

附件:河池市××关于××的通知。

方法2.----------

附件:河池市××关于××××××××××××××××××××××××××××××××××××××××××××××××××的通知

附件:河池市××关于××××××××××××××××××××××××××××××××××××××××××××××××××的通知

附件:河池市××关于××的通知

附件:河池市××关于××的通知。

方法3.----------

附件:河池市××关于××××××××××××××××××××××××××××××××××××××××××××××××××的通知

附件: 河池市× ×关于××××××××××××××××××××××××××××××××××××××××××××××××××的通知

附件:河池市××关于××的通知

附件:河池市××关于××的通知。

方法1正是我们想要的效果。

方法2把附件说明中的所有空格都删除了,扩大了删除范围,不好。

方法3没有删除接着冒号后面的空格。

附:

replace()的语法为:

string.replace(searchvalue,newvalue)

可以使用正则表达式来强化replace()的功能。

JavaScript默认的replace方法,只执行单次匹配。

要实现全局替换:可以加g标识( global) 执行反复检索。

要实现忽略大小写匹配:加i标识( ignore) 执行忽略大小写检索。

还有m标识,表示多行检索。

相关推荐
Sam902910 分钟前
【Webpack--013】SourceMap源码映射设置
前端·webpack·node.js
Python私教1 小时前
Go语言现代web开发15 Mutex 互斥锁
开发语言·前端·golang
A阳俊yi1 小时前
Vue(13)——router-link
前端·javascript·vue.js
小明说Java1 小时前
Vue3祖孙组件通信探秘:运用provide与inject实现跨层级数据传递
前端
好看资源平台1 小时前
前端框架对比与选择:如何在现代Web开发中做出最佳决策
前端·前端框架
4triumph1 小时前
Vue.js教程笔记
前端·vue.js
程序员大金1 小时前
基于SSM+Vue+MySQL的酒店管理系统
前端·vue.js·后端·mysql·spring·tomcat·mybatis
清灵xmf2 小时前
提前解锁 Vue 3.5 的新特性
前端·javascript·vue.js·vue3.5
Jiaberrr2 小时前
教你如何在微信小程序中轻松实现人脸识别功能
javascript·微信小程序·小程序·人脸识别·百度ai
白云~️2 小时前
监听html元素是否被删除,删除之后重新生成被删除的元素
前端·javascript·html