Home Web Front-end JS Tutorial What kind of regular expression can display highlight?

What kind of regular expression can display highlight?

Jan 08, 2018 am 10:36 AM
show expression

What kind of regular expression will I bring to you this time? can display highlight. How can I use regular expression to display highlight? What are the precautions for regular expression display highlight? The following is a practical case, let’s take a look.

When programmers write code, they must deal with

string and "query". There is something called a regular expression at the intersection of the two. If you use this guy well, you can improve your programming efficiency. If you don't use it well... you can learn it first.

Regarding the use of regular expressions, here is a simple example:

var m = location.href.match(/(\w+:)\/{0,3}([^\/]+)(?:(\/[^\?#]*))?(?:(\?[^#]+|.+))?(?:(#.*))?/);
var res = {
    protocol: m[1],
    host: m[2],
    path: m[3],
    search: m[4],
    hash: m[5]
};
console.log(res);
Copy after login

After holding it for a few minutes = =||, I also feel that this regular expression is not particularly easy to understand (it is red and black, it should be slightly Be clear). Some friends may not know what (?:content) means. There is also knowledge about grouping and foresight similar to (?!content) and (?=content). It is recommended to ask Brother Du and Gu Niang.

1. Small DEMO example of regular application

The following is a string of handwritten codes, placed in textarea:

/*** @author barret lee* @date   2013-10-06* @email  barret.china@gmail.com*/
//outer varvar a = "this id outer string";
//closurefunction b() { //inner var var a = "this is inner string"; var g = a.replace(/this is inner string/g, function() {  return new Function("/*clousure*/this.a")(); });
 /** * @description closure - regExp test * @author barret lee */ function c() {  return {   a: a,   g: g  } }
 return c;}
var s = b()(); //s.a, s.g
Copy after login

Regular matching, processing the above pile Small DEMO of string:

/*** @author barret lee* @date 2013-10-06* @email barret.china@gmail.com*/
//outer varvar a = "this id outer string";
//closurefunction b() {    //inner var    var a = "this is inner string";    var g = a.replace(/this is inner string/g, function() {        return new Function("/*clousure*/this.a")();    });
    /**    * @description closure - regExp test    * @author barret lee    */    function c() {        return {            a: a,            g: g        }    }
    return c;}
var s = b()(); //s.a, s.g
Copy after login

is similar to many

front-end templates, artTemplate, baiduTemplate, etc. are all excellent applications of regular expressions. It is worth taking a look at the source code and studying them carefully. Taking into account those easy-to-error points, the source code is not long, only two to three hundred lines. It is probably easier to understand one, but when you do it yourself, you will always find that many details cannot be handled well. I spent a long time fiddling with the above regular expressions = =

regular expressions, which are quite convenient to use. of. Regular skills are worth having~

I believe you have mastered the methods after reading these cases. For more exciting information, please pay attention to other related articles on the PHP Chinese website!

Related reading:

How to use jquery's ajax to asynchronously submit form data

How to implement springmvc to receive the array submitted by jquery Then extract the data

Detailed explanation of vue.js syntax and common instructions

The above is the detailed content of What kind of regular expression can display highlight?. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

How to remove news and trending content from Windows 11 Search How to remove news and trending content from Windows 11 Search Oct 16, 2023 pm 08:13 PM

When you click the search field in Windows 11, the search interface automatically expands. It displays a list of recent programs on the left and web content on the right. Microsoft displays news and trending content there. Today's check promotes Bing's new DALL-E3 image generation feature, the "Chat Dragons with Bing" offer, more information about dragons, top news from the Web section, game recommendations, and the Trending Search section. The entire list of items is independent of your activity on your computer. While some users may appreciate the ability to view news, all of this is abundantly available elsewhere. Others may directly or indirectly classify it as promotion or even advertising. Microsoft uses interfaces to promote its own content,

iOS 17's standby mode turns a charging iPhone into a home hub iOS 17's standby mode turns a charging iPhone into a home hub Jun 06, 2023 am 08:20 AM

In iOS 17 Apple is introducing Standby Mode, a new display experience designed for charging iPhones in a horizontal orientation. In this position, the iPhone is able to display a series of full-screen widgets, turning it into a useful home hub. Standby mode automatically activates on an iPhone running iOS 17 placed horizontally on the charger. You can view time, weather, calendar, music controls, photos, and more. You can swipe left or right through the available standby options and then long press or swipe up/down to customize. For example, you can choose from analog view, digital view, bubble font, and daylight view, where the background color changes based on time as time passes. There are some options

Windows 11 User Guide: How to disable ad pop-ups Windows 11 User Guide: How to disable ad pop-ups Sep 22, 2023 pm 07:21 PM

Microsoft's Windows 11 operating system may periodically display suggestions as pop-ups on your computer using the notification system. The suggestions system, originally intended to provide users with tips and suggestions for improving their Windows 11 workflows, has almost completely transformed into an advertising system to promote Microsoft services and products. Suggestion pop-ups might advertise a Microsoft 365 subscription to users, suggest linking an Android phone to the device, or set up a backup solution. If these pop-ups annoy you, you can tweak your system to disable them entirely. The following guide provides recommendations on disabling pop-ups on devices running Microsoft’s Windows 11 operating system.

Reasons and solutions for desktop layout being locked Reasons and solutions for desktop layout being locked Feb 19, 2024 pm 06:08 PM

What happens when the desktop layout is locked? When using the computer, sometimes we may encounter the situation where the desktop layout is locked. This problem means that we cannot freely adjust the position of desktop icons or change the desktop background. So, what exactly is going on when it says that the desktop layout is locked? 1. Understand the desktop layout and locking functions. First, we need to understand the two concepts of desktop layout and desktop locking. Desktop layout refers to the arrangement of various elements on the desktop, including shortcuts, folders, widgets, etc. we can be free

How to turn on live captions instantly in Windows 11 How to turn on live captions instantly in Windows 11 Jun 27, 2023 am 08:33 AM

How to turn on live subtitles instantly in Windows 11 1. Press Ctrl+L on your keyboard 2. Click Agree 3. A popup will appear saying Ready to add subtitles in English (US) (depending on your preferred language) 4. Additionally, you can filter profanity by clicking the gear button? Preference? Filtering Swear Words Related Articles How to Fix Activation Error Code 0xc004f069 in Windows Server The activation process on Windows sometimes takes a sudden turn to display an error message containing this error code 0xc004f069. Although the activation process is online, some older systems running Windows Server may experience this issue. Pass these preliminary checks and if these checks do not

How to make a remote desktop connection display the other party's taskbar How to make a remote desktop connection display the other party's taskbar Jan 03, 2024 pm 12:49 PM

There are many users using Remote Desktop Connection. Many users will encounter some minor problems when using it, such as the other party's taskbar not being displayed. In fact, it is probably a problem with the other party's settings. Let's take a look at the solutions below. How to display the other party's taskbar during Remote Desktop Connection: 1. First, click "Settings". 2. Then open "Personalization". 3. Then select "Taskbar" on the left. 4. Turn off the Hide Taskbar option in the picture.

How to check the current directory in Linux? How to check the current directory in Linux? Feb 23, 2024 pm 05:54 PM

In Linux systems, you can use the pwd command to display the current path. The pwd command is the abbreviation of PrintWorkingDirectory and is used to display the path of the current working directory. Enter the following command in the terminal to display the current path: pwd After executing this command, the terminal will display the full path of the current working directory, such as: /home/user/Documents. In addition, you can use some other options to enhance the functionality of the pwd command. For example, the -P option can display

How to display the wifi password QR code? It is recommended to scan the wifi password on WeChat in 3 seconds. How to display the wifi password QR code? It is recommended to scan the wifi password on WeChat in 3 seconds. Feb 20, 2024 pm 01:42 PM

You don’t need to enter the WIFI password often, so it’s normal to forget it. Today I will teach you the simplest way to find the password of your own WIFI. It can be done in 3 seconds. To check the WIFI password, use WeChat to scan it. The premise of this method is: there must be a mobile phone that can connect to WIFI. Okay, let’s start the tutorial: Step 1. We enter the phone, pull down from the top of the phone, bring up the status bar, and the WIFI icon. Step 2. Long press the WIFI icon to enter the WLAN settings; long press the WIFI icon. Step 3. Click Connected. Enter the WIFI name of your home, click Share Password, and a QR code will pop up; Step 4 of sharing WIFI password, we take a screenshot and save this QR code; Step 5, long press the WeChat icon on the desktop, and click Scan

See all articles