<h1>JavaScript Email Validation</h1>
<input name="email" placeholder="Email"/>
<button id="btn" >Validate</button>
<p id="message"></p>
const email = document.querySelector('input[name=email]');
const button = document.querySelector('#btn');
const text = document.querySelector('#message');
const validateEmail= (email) => {
var regex = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return regex.test(String(email).toLowerCase());
}
button.addEventListener('click',()=>{
if(validateEmail(email.value)){
text.innerText="Valid email";
}else{
text.innerText="Invalid email";
}
})
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.