JS foundation - (Supplement) 11

I have no information about the front-end learning! But the most important thing is persistence!

Preview (special effects: Web APIs,DOM,BOM)

1. Regular expression: user name; password; cell-phone number; Mailbox; Date.
2. Built in object: (parameter (mode, flag)) – > the parameter includes mode and flag mark; Modifier: i performs matching insensitive to the center of magnitude (ignoring case); g perform global matching; m performs multiline matching.
3. Constructor:

var reg = new RegExp('ab[a-z]','i');
var str = "AB";
reg.test(str);

In JavaScript, RegExp objects are regular expression objects with predefined properties and methods.
test() is a regular expression method. It searches for strings through patterns and returns true or false based on the results.

var reg = /ab[a-z]/i;
reg.test(str);
var dataStr = '2020-01-01';
var reg = /^\d{4}-\d{1,2}-\d{1,2}$/;
reg.test(dataStr);
/e/.exec("The best things in life are free!");

The exec() method is a regular expression method. It searches for strings through the specified pattern and returns the found text. If no match is found, null is returned.

Supplement: (mentioned in the video class) String object, match() extraction, replace() replacement, split() cutting, search() search.

The search() method uses an expression to search for a match, and then returns the location of the match.
The replace() method returns the modified string where the pattern is replaced.
Reference Manual: https://www.w3school.com.cn/jsref/jsref_obj_regexp.asp

4. Relevant cases

var qqStr = 'xxx';
var reg = /\d+/g;
//Extract first
var content = reg.exec(qqStr);
//Then copy and extract in sequence
do{
	var content  = reg.exec(qqStr);
	if(content){
	console.log(content[0]);
  }while(content)
//matching
var qqStr = qqStr.math(reg);

The match() method retrieves the specified value within a string or finds a match for one or more regular expressions.

Group extraction: in regular expressions (), it is used as a group to obtain the matching result of the group, and regex$ 1 $2 $3... To get it.
Rookie tutorial: https://www.runoob.com/regexp/regexp-tutorial.html

var dataStr = '2022-01-01';
var dataReg = /^(\d{4})-(\d{1,2})-(\d{1,2})$/;
if(dataReg.test(dataStr)){
	console.log(RegExp.$1);
	}

The replace() method is used to replace some characters with others in a string, or to replace a substring that matches a regular expression. stringObject.replace(regexp/substr,replacement): replacement specifies the replacement text or the function that generates the replacement text.

var dataStr = 'nnnn mmmm';
str = str.replace(/\s/g,'*');

The split() method is used to split a string into an array of strings. stringObject.split(separator,howmany): howmany: optional. This parameter can specify the maximum length of the returned array. If this parameter is set, no more substrings will be returned than the array specified by this parameter. If this parameter is not set, the whole string will be split regardless of its length.

var dataStr = '2020-01-17';
dataStr.split('-');

Add: greed is to match as much as possible; Non greed is to have as few matches as possible; Will? Immediately following any quantifier * + or {} makes the quantifier non greedy/ \s*/ /\s*$/

There are some redundant codes in the video class, so send them just in case!
Form validation:

//This is for switching labels!
window.onload = function () {
    /*Get the required label*/
    var as = document.getElementsByClassName('content-header')[0].getElementsByTagName('a');
    var contents = document.getElementsByClassName('dom');
    for(var i=0;i<as.length;i++){
        /*Take out a single object*/
        var a = as[i];
        a.id = i;

        a.onclick = function () {
            for(var j=0;j<as.length;j++) {
                as[j].className = '';
                contents[j].style.display = 'none';
            }

            this.className = "current";
            contents[this.id].style.display = 'block';
        }
    }
}

Verify phone number:

var phone = document.getElementById('phone');
phone.onblur = function(ev){
	var reg = /^(13[0-9]|14[5|7]|15[0|1|2|3|4|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/;
	if(!reg.test(this.value)){
		this.style.borderColor = "#ff0000";
		}else{
		this.style.(slightly)
		}
	}

Added by tunage on Fri, 18 Feb 2022 11:26:28 +0200