js进阶正则表达式实现过滤字符串（RegExp对象操作正则表达式）（正则：regular）（表达式：expression）

一、总结

1、str_replace：正则作用：高效快速匹配

2、break关键字

3、RegExp对象操作正则表达式

（正则：regular）

  • ['regjʊlə]

（表达式：expression）

  • [ɪkˈspreʃn]

二、js进阶正则表达式实现过滤字符串

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

   <meta charset="utf-8">

   <title>课堂演示</title>

   <style type="text/css">

     div{

             background: rgba(30,100,30,0.2);

             width: 800px;

             margin:20px auto;

             padding: 15px;

             text-align: center;

         }

         h2{

             text-align: center;

         }

         input[type=text]{

             height: 30px;

             font-size: 20px;

             width: 600px;

             padding: 10px;

         };

   </style>

 </head>

 <body>

 <h2>正则表达式示例演示</h2>

 <div>

     <p>示例字符串：<input type="text" id="str" name="str" value=""></p>

     <p>筛选部分：<input type="text" id="st" name="st" value=""></p>

     <p>筛选结果：<input type="text" id="res" name="res" value=""></p>

     <input type="button" value="测试按钮" onclick="resplace()">

 </div>

   <script type="text/javascript">

     function  resplace(){

         var str=document.getElementById('str').value;

         var  st=document.getElementById('st').value;

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

         /*

         for(var i=0;i<str.length;i++){

             if (str.indexOf(st)>-1){

                 str=str.replace(st,'')   //1、str_replace：正则作用：高效快速匹配

                 //把包含特定字符串转换成空字符

             }else{break}//如果没有了，退出循环 //2、break关键字

         }

         res.value=str;

         */

         res.value=str.replace(new RegExp(st,'g'),''); //3、RegExp对象操作正则表达式

     }

   </script>

 </body>

 </html>

js进阶正则表达式实现过滤字符串（RegExp对象操作正则表达式）（正则：regular）（表达式：expression）的更多相关文章

  1. js进阶 11-15 jquery过滤方法有哪些

    js进阶 11-15  jquery过滤方法有哪些 一.总结 一句话总结:jquery方法中的参数一般是什么:选择器.元素或 jQuery 对象. 1.jquery方法中的参数一般是什么? 选择器.元 ...

  2. js进阶课程 12-9 jquery的事件对象event的方法有哪些？

    js进阶课程 12-9 jquery的事件对象event的方法有哪些? 一.总结 一句话总结:三组六个,阻止默认事件一组,阻止冒泡一组,阻止冒泡和剩余事件一组. 1.事件的默认动作指什么? 比如点a标 ...

  3. js进阶 11-3 jquery中css属性如何操作

    js进阶 11-3  jquery中css属性如何操作 一.总结 一句话总结:通过css()方法 1.attr和css是有交叉的,比如width,两者中都可以设置,那么他们的区别是什么? 其实通俗一点 ...

  4. JS RegExp对象（正则表达式）

    笔记整理自:廖雪峰老师的JS教程 正则表达式语法:https://www.runoob.com/regexp/regexp-tutorial.html 目录 创建方式 方式一 方式二 简单使用 判断正 ...

  5. js中的事件，内置对象，正则表达式

    [JS中的事件分类] 1.鼠标事件: click/dbclick/mouseover/mouseout/mousemove/mousedown/mouseup 2.键盘事件: keydown: 键盘按 ...

  6. 原生JS中常用的Window和DOM对象操作汇总

    一.常用的Window对象操作 Window对象中又包含了document.history.location.Navigator和screen几个对象,每个对象又有自己的属性方法,这里window可以 ...

  7. JS进阶之---执行上下文，变量对象，变量提升

    一.结构顺序大体介绍 JavaScript代码的整个执行过程,分为两个阶段,代码编译阶段与代码执行阶段. 编译阶段由编译器完成,将代码翻译成可执行代码,这个阶段作用域规则会确定. 执行阶段由引擎完成, ...

  8. js进阶 11-1 jquery中的页面内容操作的三个方法

    jquery中的页面内容操作的三个方法 一.总结 一句话总结:记三个方法即可.text,html,val.因为这里是方法,所以设置值的是后面方法的参数. 1.jquery中的页面内容操作的三个方法? ...

  9. js进阶js中支持正则的四个常用字符串函数（search march replace split）

    js进阶js中支持正则的四个常用字符串函数(search march replace split) 一.总结 代码中详细四个函数的用法 search march replace split 二.js进 ...

随机推荐

  1. Slick教程

    Slick 编程(1): 概述 Slick 编程(2): 准备开发环境 Slick 编程(3): 基本查询 Slick 编程(4): 数据库连接和事务处理 Slick 编程(5): 数据库Schema ...

  2. linux host主机名配置

    1.查看主机名 #hostname 2.查看ip #ifconfig 2.添加主机名配置 #vi /etc/hosts 新增一行 172.23.26.195 vhost145.idmp.safe

  3. RingtoneManager-获得系统当前的铃声

    我们直接看代码 bt1 = (Button) findViewById(R.id.bt1); bt2 = (Button) findViewById(R.id.bt2); bt3 = (Button) ...

  4. 73.fseek与宽字符读取文件

    fseek //文件路径 ] = "1.txt"; //FILE *pf = fopen(path, "a+");//尾部添加,文件指针在尾部 //FILE * ...

  5. THC=TERMINAL HANDLING CHARGE,碼頭操作費

    THC=TERMINAL HANDLING CHARGE,碼頭操作費

  6. JAVA Mail邮件实现发送

    package com.test;import java.util.Date;import java.util.Properties;import javax.mail.Message;import ...

  7. JS前端监控机制的建立

    JS前端监控机制: 1.采用try...catch...,和window.onerror的形式. 2.最终形成错误日志文件,并发送邮件和短信的形式进行报警. 3.如果是跨域请求,在script标签上要 ...

  8. BZOJ1576: [Usaco2009 Jan]安全路经Travel(树链剖分)

    Description Input * 第一行: 两个空格分开的数, N和M * 第2..M+1行: 三个空格分开的数a_i, b_i,和t_i Output * 第1..N-1行: 第i行包含一个数 ...

  9. vmware workstation15.1.0下载地址及密钥(亲测可用)

    官网下载链接: https://download3.vmware.com/software/wkst/file/VMware-workstation-full-15.1.0-13591040.exe ...

  10. 【hdu 4333】Revolving Digits

    [链接]http://acm.hdu.edu.cn/showproblem.php?pid=4333 [题意] 就是给你一个数字,然后把最后一个数字放到最前面去,经过几次变换后又回到原数字,问在这些数 ...