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. web性能优化——JSP

    一.啰嗦 做web开发的都知道,性能的重要性就不必强调了.就前端展示的工作来说,jsp大家都熟悉html更熟悉:web服务器tomcat应该是最熟悉的了:web方面的基础知识上来说,静态页面比动态页面 ...

  2. openOffice安装

    [root@rusky openOffice]# tar -zxvf OOo_3..0_Linux_x86_install-rpm-wJRE_zh-CN.tar.gz [root@rusky open ...

  3. Linux系统 fdisk命令 创建新分区

    --fdisk命令fdisk -l /dev/sda           # 查看分区 fdisk    /dev/sda           # 创建分区  n                    ...

  4. 拦截Response.Redirect的跳转并转换为Js的跳转

    有一个很常见的需求,某个页面需要用户登录才能访问,或者某个操作需要用户登录 这就需要检测用户登录,一般是使用Ajax去检测是否登录,当用户未登录时跳转到登录页面 那么问题来了···· 有的时候我们跳转 ...

  5. ClustrMaps——访问者位置

    ClustrMaps——访问者位置: http://www3.clustrmaps.com/zh/counter/maps.php?url=http://www.cnblogs.com/JuneZha ...

  6. 逆向并查集 hrbust 1913

    #include<iostream> //由于拆除并查集的方法太难或者没有#include<cstdio> //可以先将所有没有拆的桥连接 再逆向操作 断开变成连接 反向输出# ...

  7. GDI相关基础知识

    原文链接:http://blog.csdn.net/poem_qianmo/article/details/7333886 GDI(Graphics Device Interface) 图形设备接口, ...

  8. shell中的path expansion

    glob扩展 在shell中的路径扩展中,涉及到的glob有如下几种: ? 匹配任何单个字符 * 匹配0到多个字符 [set] 匹配任何一个在set当中的字符,如[0-9],则匹配任何一个数字 [!s ...

  9. em与px的区别 [ 转 ]

    其实,还是不大理解,为什么1em=16px:而且,还一般要在body里面,就写清楚Fone-size=62.5%,然后再让1em=10px进行使用:那么,为什么不直接在当时定义em的时候,就直接让它等 ...

  10. HTML&CSS基础学习笔记1.7-高亮文本及组合使用

    HTML提供了<mark>标签可以让你的文本高亮,这样看起来更加醒目.<mark>标签内的文本会呈现特殊的样式,它和<em>,<strong>一样也是一 ...