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

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

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

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

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

<!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>

运行结果如下:

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

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

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

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

<!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标识,表示多行检索。


相关文章
|
8月前
|
开发框架 JavaScript 前端开发
精选HTML、JavaScript、ASP代码片段集锦
这些代码片段代表了HTML, JavaScript和ASP的基本应用,可被集成到更复杂的项目中。它们注重实用性,并且易于理解,旨在帮助开发者快速开始项目构建或进行学习。尽管ASP不如其他服务器端技术(如Node.js, PHP, Ruby等)现代,但它在遗留系统中仍非常普遍,了解基础仍具有价值。
276 14
|
存储 JavaScript 前端开发
用 HTML + JavaScript DIY 渐进式延迟法定退休年龄测算器
用 HTML + JavaScript DIY 渐进式延迟法定退休年龄测算器
|
人工智能 程序员 UED
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
734 21
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
|
存储 API 文件存储
单页图床HTML源码+本地API接口图床系统源码
图床系统是一种用于存储和管理图片文件的在线服务。它允许用户上传图片文件,并生成相应的图片链接,从而方便用户在网页、社交媒体或其他平台上分享图片。
535 2
单页图床HTML源码+本地API接口图床系统源码
|
前端开发 JavaScript
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
542 14
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
|
前端开发
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
379 1
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
html+js+css实现的建筑方块立体数字时钟源码
html+js+css实现的建筑方块立体数字时钟源码
582 33
Next.js 实战 (二):搭建 Layouts 基础排版布局
本文介绍了作者在Next.js v15.x版本发布后,对一个旧项目的重构过程。文章详细说明了项目开发规范配置、UI组件库选择(最终选择了Ant-Design)、以及使用Ant Design的Layout组件实现中后台布局的方法。文末展示了布局的初步效果,并提供了GitHub仓库链接供读者参考学习。
486 1
Next.js 实战 (二):搭建 Layouts 基础排版布局
|
JavaScript
JS鼠标框选并删除HTML源码
这是一个js鼠标框选效果,可实现鼠标右击出现框选效果的功能。右击鼠标可拖拽框选元素,向下拖拽可实现删除效果,简单实用,欢迎下载
169 4
|
小程序 JavaScript 前端开发
你的生日是星期几?HTML+JavaScript帮你列出来
你的生日是星期几?HTML+JavaScript帮你列出来