The simplest use of Regular Expressions is to find a plain text pattern. In this lesson we'll look at at finding plain text patterns as well as using the metacharacter "." and how to escape a metacharacter.

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <title>Javascript Regular Expressions: Find Plain Text Patterns</title>

  <style>

    pre {

      line-height: 2;

    }

    span {

      background-color: #eee;

      padding: 1px;

      outline: 1px solid #999;

    }

  </style>

</head>

<body>

  <pre></pre>

</body>

</html>
'use strict';

var str = `Cat

sat on

the hat.`;

var regex = /..\./g  //any two charaters follow by a '.'

/**

 * @param  String str

 * @param  RegExp regex

 * @param  HTMLElement target

 */

const output = (str, regex, target) => {

  target.innerHTML =

    str.replace(regex, str =>

      `<span>${str}</span>`

    );

}

output(str, regex, document.querySelector('pre'));

[Regular Expressions] Find Plain Text Patterns的更多相关文章

  1. Regular Expressions in Grep Command with 10 Examples --reference

    Regular expressions are used to search and manipulate the text, based on the patterns. Most of the L ...

  2. 正则表达式（Regular expressions）使用笔记

    Regular expressions are a powerful language for matching text patterns. This page gives a basic intr ...

  3. PCRE Perl Compatible Regular Expressions Learning

    catalog . PCRE Introduction . pcre2api . pcre2jit . PCRE Programing 1. PCRE Introduction The PCRE li ...

  4. 8 Regular Expressions You Should Know

    Regular expressions are a language of their own. When you learn a new programming language, they're ...

  5. Regular Expressions --正则表达式官方教程

    http://docs.oracle.com/javase/tutorial/essential/regex/index.html This lesson explains how to use th ...

  6. Introducing Regular Expressions 学习笔记

    Introducing Regular Expressions 读书笔记 工具: regexbuddy:http://download.csdn.net/tag/regexbuddy%E7%A0%B4 ...

  7. [转]8 Regular Expressions You Should Know

    Regular expressions are a language of their own. When you learn a new programming language, they're ...

  8. Finding Comments in Source Code Using Regular Expressions

    Many text editors have advanced find (and replace) features. When I’m programming, I like to use an ...

  9. Python re module (regular expressions)

    regular expressions (RE) 简介 re模块是python中处理正在表达式的一个模块 r"""Support for regular expressi ...

随机推荐

  1. UITextField点击return后注销第一响应者

    // 当点击了return按钮,就让text调用自己的endEditing方法 [textField addTarget:textField action:@selector(endEditing:) ...

  2. Python 类 --基础与要点

    1:2.x与3.x区别: 2.x:老式类,都继承自object,继承机制为深度优先 3.x:新式类不需要写(object),继承机制为广度优先 2:类说明: 在定义类下用""&qu ...

  3. 《第一行代码》学习笔记36－服务Service（3）

    1.为了更加方便在子线程中对UI操作,借助Android中提供的AsyncTask,十分简单地从子线程到主线程的. 2.一个最简单的自定义AsyncTask写成如下方式: class Download ...

  4. displaytag 简单使用流程

    1. 首先导入包:displaytag-1.2.jar,commons-lang.jar和standard.jar;commons-beanutils.jar;这四个jar包 2. 然后在jsp页面做 ...

  5. iOS_SN_CocoaPods使用详细说明( 转)

    一.概要 iOS开发时,项目中会引用许多第三方库,CocoaPods(https://github.com/CocoaPods/CocoaPods)可以用来方便的统一管理这些第三方库. 二.安装 由于 ...

  6. angularjs深入理解向指令传递数据，双向绑定机制

    <!DOCTYPE html> <html lang="zh-CN" ng-app="app"> <head> <me ...

  7. DX笔记之六------游戏画面绘图之透明特效的制作方法

    原文链接:http://blog.csdn.net/zhmxy555/article/details/7338082 透明效果 由于所有的图文件都是以矩形来储存的,我们也许会需要把一张怪兽图片贴到窗口 ...

  8. typedef std::string AddressLines[4]定义了一个string数组，大小为4

    int main() { typedef std::]; std::]; std::string *pal1 = new AddressLines; delete [] pal; delete [] ...

  9. PS 色彩的色相谱

    7- 色彩的色相谱 在这个环中,位于180度夹角的两种颜色(也就是圆的某条直径两端的颜色),称为反转色,又称为互补色.互补的两种颜色之间是此消彼长的关系,小框往蓝色移动的同时就会远离黄色, 黄色＝白色 ...

  10. c语言，全局变量，局部变量，外部函数，内部函数，stasic和extern的复习总结

    @import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/c ...