How to implement the native verification boxes in HTML5, such as required, pattern, etc., when the verification is invalid? Why does a prompt box with different content pop up when it is invalid because different constraints are not met? Is it implemented by combining the invalid event and the validity attribute? How does the setCustomValidity() method work? I feel like this content is getting more confusing the more I read it, so I would like to ask some experts for advice...
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Go check out the form verification on MDN. I think it’s quite clear. You can follow the small demo and you’ll understand it slowly.
required: Blank verification, for example:
If the value of input[type=text] is empty, a prompt box will pop up and form submission will be prevented;
pattern: matches a regular expression, for example:
If the value of input[type=text] is not 3 digits, a prompt will be raised when clicking the submit button