js过滤HTML标签以及空格的思路及代码


Posted in Javascript onMay 24, 2013
function setContent(str) {
str = str.replace(/<\/?[^>]*>/g,''); //去除HTML tag
str.value = str.replace(/[ | ]*\n/g,'\n'); //去除行尾空白
//str = str.replace(/\n[\s| | ]*\r/g,'\n'); //去除多余空行
return str;
}

测试的时候发现这段代码不能过滤掉网页中空格字符(即: )。于是自己又改造了一下:

function removeHTMLTag(str) {
            str = str.replace(/<\/?[^>]*>/g,''); //去除HTML tag
            str = str.replace(/[ | ]*\n/g,'\n'); //去除行尾空白
            //str = str.replace(/\n[\s| | ]*\r/g,'\n'); //去除多余空行
            str=str.replace(/ /ig,'');//去掉 
            return str;
    }

恩,我的要求达到了。

现在来稍稍解释一下所用到的三个正则表达吧(需要说明的是,因为自己也是刚刚接触,也许我的解释并不是正确的,仅供参考):

第一个:/<\/?[^>]*>/g

在js中正则表达式是以“/”开头的,后面的/g,含义是表示全局模式,意思是在将匹配的模式应用于整个字符串,而不是在第一次匹配上之后就停止匹配了。

<\/?[^>]*> 这个分开来解释,其中第二个字符“\”是一个转移字符,用来转移后面的”/”字符的。?匹配0或1个正好在它之前的那个字符。注意:这个元字符不是所有的软件都支持的。所以<\/?就是匹配html标签中的”</”格式或者“<”格式的。

再来说[^>]*>。[]是含义是:

js过滤HTML标签以及空格的思路及代码

 ^的含义是:匹配一行的开始。例如正则表达式^When in能够匹配字符串"When in the course of human events"的开始,但是不能匹配"What and When in the"。意思就是匹配以“When in”开头的文字。

*的含义是:匹配0或多个正好在它之前的那个字符。例如正则表达式。*意味着能够匹配任意数量的任何字符

因此[^>]*意思是匹配>之外的字符。所以[^>]可以匹配出的模式可以像下面这样的:

div
我需要的文字</div

我需要的文字</p

*和前面的[^>]结合在一起就可以匹配下面这些字符了:

div>我需要的文字</div
p>我需要的文字</p
br /
再加上后面的>就可以匹配下面的字符了:

div>我需要的文字</div>
p>我需要的文字</p>
br />
这样就完成了一对HTML标签的匹配了。(多句话,总觉得这个匹配有点??拢??遣恢?赖降自谀母龅胤???

第二个:/[ | ]*\n/g:我也没有看懂

第三个:/ /ig:就是直接查找 字符,后面的/ig的含义是在全局模式下进行不区分大小写的查找。g代表全局,i表示不区分大小写。

Javascript 相关文章推荐
地址栏上的一段语句,改变页面的风格。(教程)
Apr 02 Javascript
JSON 和 JavaScript eval使用说明
Jun 13 Javascript
事件绑定之小测试  onclick &amp;&amp; addEventListener
Jul 31 Javascript
javascript真的不难-回顾一下基础知识
Jan 15 Javascript
js 右侧浮动层效果实现代码(跟随滚动)
Nov 22 Javascript
angularJS Provider、factory、service详解及实例代码
Sep 21 Javascript
js在ie下打开对话窗口的方法小结
Oct 24 Javascript
Javascript 跨域知识详细介绍
Oct 30 Javascript
jQuery的中 is(':visible') 解析及用法(必看)
Feb 12 Javascript
ES6(ECMAScript 6)新特性之模板字符串用法分析
Apr 01 Javascript
js调用刷新界面的几种方式
May 03 Javascript
解决antd日期选择组件,添加value就无法点击下一年和下一月问题
Oct 29 Javascript
jQuery实现表头固定效果的实例代码
May 24 #Javascript
如何阻止复制剪切和粘贴事件为了表单内容的安全
May 23 #Javascript
使用js+jquery实现无限极联动
May 23 #Javascript
dwz 如何去掉ajaxloading具体代码
May 22 #Javascript
自动最大化窗口的Javascript代码
May 22 #Javascript
JS中的prototype与面向对象的实例讲解
May 22 #Javascript
JS定时关闭窗口的实例
May 22 #Javascript
You might like
php file_exists 检查文件或目录是否存在的函数
2010/05/10 PHP
编写安全 PHP应用程序的七个习惯深入分析
2013/06/08 PHP
php轻松实现中英文混排字符串截取
2014/05/28 PHP
PHP开发框架laravel安装与配置教程
2015/03/13 PHP
浅谈PHP无限极分类原理
2019/03/14 PHP
javascript 点击整页变灰的效果(可做退出效果)。
2008/01/09 Javascript
JavaScript的9个陷阱及评点分析
2008/05/16 Javascript
javascript 异常处理使用总结
2009/06/21 Javascript
JQuery 学习笔记 选择器之二
2009/07/23 Javascript
jQuery常见开发技巧详细整理
2013/01/02 Javascript
基于Jquery+Ajax+Json实现分页显示附效果图
2014/07/30 Javascript
关闭页面时window.location事件未执行的原因分析及解决方案
2014/09/01 Javascript
jQuery中deferred对象使用方法详解
2016/07/14 Javascript
浅析ES6的八进制与二进制整数字面量
2016/08/30 Javascript
Angular.JS学习之依赖注入$injector详析
2016/10/20 Javascript
Js自动截取字符串长度,添加省略号(……)的实现方法
2017/03/06 Javascript
JavaScript生成图形验证码
2020/08/24 Javascript
jQuery实现广告条滚动效果
2017/08/22 jQuery
js仿微信抢红包功能
2020/09/25 Javascript
angular 未登录状态拦截路由跳转的方法
2018/10/09 Javascript
Vue+Element实现网页版个人简历系统(推荐)
2019/12/31 Javascript
Python 字符串定义
2009/09/25 Python
Python定时执行之Timer用法示例
2015/05/27 Python
解决已经安装requests,却依然提示No module named requests问题
2018/05/18 Python
Django中使用极验Geetest滑动验证码过程解析
2019/07/31 Python
在django中,关于session的通用设置方法
2019/08/06 Python
Debenhams百货英国官方网站:Debenhams UK
2016/07/12 全球购物
Expedia加拿大官方网站:加拿大最大的在线旅游提供商
2017/12/31 全球购物
Homestay中文官网:全球寄宿家庭
2018/10/18 全球购物
Agoda中文官网:安可达(低价预订全球酒店)
2021/01/18 全球购物
幼儿园教师国培感言
2014/02/02 职场文书
招商专员岗位职责
2014/02/08 职场文书
超市创业计划书
2014/09/15 职场文书
2015年乡镇纪委工作总结
2015/05/26 职场文书
三严三实·严以修身心得体会
2016/01/15 职场文书
导游词之徐州云龙湖
2019/11/19 职场文书