Shulou(Shulou.com)06/02 Report--

This article will explain in detail what regular expressions are commonly used in front-end development. The editor thinks it is very practical, so I share it with you as a reference. I hope you can get something after reading this article.

Regular expression (regular expression) describes a pattern of string matching, which can be used to check whether a string contains a certain substring, replace a matching substring, or extract a substring from a string that meets a certain condition.

When you list a directory, * .txt in dir * .txt or ls * .txt is not a regular expression, because here * and regular * have a different meaning.

You construct regular expressions in the same way as you create mathematical expressions. That is, you can combine small expressions with multiple metacharacters and operators to create larger expressions. The components of a regular expression can be a single character, a character collection, a character range, a choice between characters, or any combination of all these components.

A regular expression is a text pattern that consists of ordinary characters (such as characters a to z) and special characters (called metacharacters). The pattern describes one or more strings to match when searching for text. The regular expression acts as a template that matches a character pattern with the searched string.

Regular expression, a very old and powerful text processing tool, can quickly implement a very complex business logic with only a very short expression statement. If you are proficient in regular expressions, you can greatly improve your development efficiency.

Regular expressions are often used to check fields or arbitrary strings, such as the following JavaScript code that verifies the basic date format:

Var reg = / ^ (\\ d {1Power4}) (- |\\ /) (\\ d {1Power2})\ 2 (\\ d {1Power2}) $/; var r = fieldValue.match (reg); if (r==null) alert ('Date format errorships')

Here are 20 regular expressions commonly used in front-end development:

1. Check password strength

The strength of the password must be a combination of uppercase and lowercase letters and numbers, cannot use special characters, and is between 8 and 10 in length.

^ (? = .*\\ d) (? = .* [amurz]) (? = .* [Amurz]). {8Magol 10} $

two。 Check Chinese

The string can only be in Chinese.

^ [\ u4e00 -\ u9fa5] {0,} $

3. A string consisting of numbers, 26 letters, or underscores

^\\ wish$

4. Verify E-Mail address

As with passwords, the following is a regular check statement for E-mail address compliance.

[\ w]? [\\ w] (?) [: [\\ w] * [\\ w])?

5. Check ID card number

Here is the regular check of the ID card number. 15 or 18.

15:

^ [1-9]\\ d {7} ((0\\ d) | (1 [0-2])) (([0 | 1 | 2]\\ d) | 3 [0-1])\\ d {3} $

18 bits:

^ [1-9]\\ d {5} [1-9]\\ d {3} ((0\\ d) | (1 [0-2])) (([0 | 1 | 2]\\ d) | 3 [0-1]))\\ d {3} ([0-9] | X) $

6. Check date

Date check in "yyyy-mm-dd" format, taking into account flat leap years.

^ (?: (! 0000) [0-9] {4}-(: 0 [1-9] | 1 [0-2])-(?: 0 [1-9] | 1 [0-9] | 2 [0-8]) | (?: 0 [13-9] | 1 [0-2])-(?: 29 | 30) | (?: 0 [13578] | 1 [02])-31) | (?: [0-9] {2} (?: 0 [48]) | 2468] [048] | [13579] [26]) | (?: 0 [48] | [2468] [048] | [13579] [26]) 00)-02-29) $

7. Check amount

Amount check, accurate to 2 decimal places.

^ [0-9] + (. [0-9] {2})? $

8. Check the mobile phone number

The following is the regular expression of the domestic mobile phone number at the beginning of 13, 15 and 18.

^ (13 [0-9] | 14 [5 | 7] | 15 [0 | 1 | 2 | 3 | 6 | 7 | 8 | 9] | 18 [0 | 1 | 2 | 3 | 5 | 6 | 7 | 9])\\ d {8} $

9. Determine the version of IE

IE has not been completely replaced yet, and many pages still need to be version compatible. Here are the expressions for IE version checking.

^. * MSIE [5-8] (?:\. [0-9] +)? (?!. * Trident\ / [5-9]\ .0). * $

10. Verify IP-v4 address

IP4 regular statement.

\\ b (?: 25 [0-5] | 2 [0-4] [0-9] | [01]? [0-9] [0-9]?)\\.) {3} (?: 25 [0-5] | 2 [0-4] [0-9] | [01]? [0-9] [0-9]?)\\ b

11. Verify IP-v6 address

IP6 regular statement.

(([0-9a-fA-F] {1rect 4}:) {79a-fA-F 7} [0-9a-fA-F] {1pr 4} | ([0-9a-fA-F] {1pr 4}:) {1Mague 7}: | ([0-9a-fA-F] {1pr 4}:) {1pr 6}: [0-9a-fA-F] {1pr 4} | ([0-9a-fA-F] {1pm 4}:) {1pm 5} (: [0-9a-fA-F] {1pm 4}) {1pm 2}) | | ([0-9a-fA-F] {1score4}:) {19a-fA-F 4} (: [0-9a-fA-F] {1score4}) {19a-fA-F 3} | ([0-9a-fA-F] {1Power4}:) {19a-fA-F 3} (: [0-9a-fA-F] {1pr 4}) {1c4} | ([0-9a-fA-F] {1pr 4}:) {1pr 2} (: [0-9a-fA-F] {1pm 4}) {1pm 5} | ] {19a-fA-F 4}: (: [0-9a-fA-F] {1 9a-fA-F 4}) {1 9a-zA-Z 6}) | (: (: [0-9a-fA-F] {1 9a-zA-Z 4}) {1 9a-fA-F 7} |:) | (: [0-9a-fA-F] {0pr 4}) {0pr 4}% [0 -] {1 | |:: (ffff (: 0 {0 9a-fA-F 4}) {0Power1}:) {0ffff 1} ((25 [0-5]) | (2 [0-4] | 1 {0Power1} [0-9]) {0Magne1} [0-9]) {0Magne1} (25 [0-5] | (2 [0-4] | 1 {0quotient 1} [0-9]) {0jin1} [0-9]) | ([0-0] 1}:) {1pm 4}: (25) [0-5] | (2 [0-4] | 1 {0rect 1} [0-9]) {0rect 1} [0-9])\\.) {3jue 3} (25 [0-5] | (2 [0-4] | 1 {0jue 1} [0-9]))

twelve。 Check the prefix of URL

In application development, it is often necessary to distinguish between HTTPS and HTTP. The following expression can be used to extract a url prefix and then logically judge.

If (! s.match (/ ^ [a-zA-Z] +:\ / /)) {s = 'http://' + s;}

13. Extract URL links

The following expression filters out the URL in a piece of text.

^ (f | ht) {1} (tp | tps):\ /\ / ([\\ w -] +\\.) + [\\ w -] + (\ / [\\ w -. /?% & =] *)?

14. File path and extension check

Verify the file path and extension

^ ([a-zA-Z]\\: |\)\ ([^\] +\) * [^\ /: *? "|] +\ .txt (l)? $

15. Extract Color Hex Codes

Sometimes you need to extract the color code from a web page, you can use the following expression.

\\ # ([a-fA-F] | [0-9]) {3jue 6}

16. Extract pictures from web pages

If you want to extract all the picture information from the page, you can use the following expression.

\\

] * [src] * = * [\ "\'] {0reco1} ([^\\"\\'\ >] *)

17. Extract page hyperlinks

Extract hyperlinks from html.

(;] *) (href= "https?://) ((?! (: (?: www\\.)? 'implode (' | (?: www\\.), $follow_list).)) [^"] +) "((?!. *\\ brel=) [^ >;] *) (?: [^ >;] *) >

18. Refined CSS

With the following expression, you can search for CSS with the same attribute value, thus achieving the purpose of refining the code.

^\\ s * [a-zA-Z\\ -] +\\ s * [:] {1}\\ s [a-zA-Z0-9\\ s.#] + [;] {1}

19. Extract comments

If you need to remove comments from HMTL, you can use the following expression.

20. Match HTML tags

You can match the tags in HTML with the following expression.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.