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

Regular expressions are often used to validate fields or arbitrary strings, as in this JavaScript code that validates the basic date format:

Var/reg = ^ (\ \ d {1, 4}) (- | \ \ /) (\ \ d {1, 2}) \ \ 2 (\ \ d {1, 2}) $/; var r = fieldValue.match(reg); if(r==null)alert('Date format error! ');Copy the code

Below is a list of 20 regular expressions that are often used in front-end development.

1. Verify the password strength

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

^ (? =.*\\d)(? =.*[a-z])(? =. * [a-z]). 8, 10 {} $Copy the code

2. Verify Chinese

The string can only be Chinese.

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

3. The value contains 26 letters, digits, and underscores (_)

^\\w+$Copy the code

4. Verify the E-mail address

As with passwords, here is a regular check for E-mail address compliance.

[\\w!#$%&'*+/=?^_`{|}~-]+(? :\\.[\\w!#$%&'*+/=?^_`{|}~-]+)*@(? :[\\w](? :[\\w-]*[\\w])? \ \.) +[\\w](? :[\\w-]*[\\w])?Copy the code

5. Verify the ID card number

The following is the regular verification of the ID number. 15 or 18.

15:

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

18:

^[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)$Copy the code

6. Verification date

Date verification in “YYYY-MM-DD” format, including flat leap years.

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

7. Check amount

Amount check, accurate to 2 decimal places.

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

8. Check your phone number

The following is a regular expression for mobile phone numbers starting with 13, 15, and 18.

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

9. Check the VERSION of Internet Explorer

IE has not been completely replaced, many pages still need to do version compatibility, the following is the expression of THE IE version check.

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

10. Verify IP address V4

IP4 regular statements.

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

11. Verify the IP-v6 address

IP6 regular statement.

(([0-9 a - fA - F] {1, 4} {7, 7}) [0-9 a - fA - F] {1, 4} | ([0-9 a - fA - F] {1, 4} {1, 7}) : | ([0-9 a - fA - F] {1, 4} {1, 6}) : [0-9 a - fA - F] {1, 4} | ([0-9 - fA - a F] {1, 4} {1, 5}) (: [0-9 a - fA - F] {1, 4}, {1, 2} | ([0-9] a - fA - F {1, 4} {1, 4}) (: [0-9 a - fA - F] {1, 4}, {1, 3} | ([0-9 a - fA - F] {1, 4} {1, 3}) (: [0-9 - a FA - F] {1, 4} {1, 4} | ([0-9 a - fA - F] {1, 4}} {1, 2) (: [0-9 a - fA - F] {1, 4}, {1, 5} | [0-9 a - fA - F] {1, 4} : ((: [0-9 a - fA - F] {1, 4}, {1, 6}) | : ((: [0-9 - a FA - F] {1, 4} {1, 7} | :) | fe80: : [0-9 a - fA - F] {0, 4}) {0, 4} % [0-9 a zA - Z] {1} | : : (FFFF (: 0 {1, 4}) {0, 1} {0, 1} ((25) [0 to 5) | (2 [0 to 4] | 1 {0, 1} [0 9]) {0, 1} [0-9]) \ \.) {3} (25 [0 to 5) | (2 [0 to 4] | 1 {0, 1} [0-9]) {0, 1} [0-9]) | ([0-9 a - fA - F] {1, 4} {1, 4}) : ((25 [0 to 5) | (2 [0 to 4] | 1 {0, 1} [0-9]) {0, 1} [0-9]) \ \.) {3} (25 [0 to 5) | (2 | 1 [0-4] [0-9] {0, 1}) [0-9] {0, 1}))Copy the code

12. Check the URL prefix

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

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

13. Extract URL links

The following expression filters out a URL from a piece of text.

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

14. Verify file path and extension

Verify the file path and extension

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

15. Extract Color Hex Codes

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

\ \ # ([a - fA - F] |) [0-9] {3, 6}Copy the code

16. Extract web images

If you want to extract all the image information in a web page, you can use the following expression.

\ \ < * [img] [^ \ \ >] * (SRC) * = * [\ \ "\ \ '] {0, 1} ([^ \ \ \ \ '\ \" >] *)Copy the code

Extract page hyperlinks

Extract hyperlinks in HTML.

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

18. Pure CSS

Using the following expression, you can search for CSS with the same property value to refine your code.

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

19. Extract comments

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

Copy the code

20. Match the HTML tag

Tags in HTML can be matched by the following expression.

\\s]+))?) +\\s*|\\s*)/? >Copy the code

Syntax for regular expressions




Technical artisan, welcome to share the above content to circle of friends/micro blog, etc. If you need to reprint, please contact authorized through the letter. Thank you!