DOM

유효성 검사 Sprint

Self Advanced Challenges

특수 기호 검사하기

아이디에 특수 기호를 입력하면 다음과 같이 표시하기

• 아이디는 영문, 숫자만 가능합니다.

hide 클래스

display: none 값을 가진 hide 클래스를 생성하고 적용해
클래스가 적용되면 문구가 포함된 div 요소를 안보이게 하고
클래스가 적용되지 않으면 문구가 포함된 div 요소를 보이게 한다.

<div class="special-word hide">아이디는 영문, 숫자만 가능합니다</div>

RegExp.text()

주어진 문자열이 정규 표현식을 만족하는지 판별하고
그 여부를 true / false 로 반환한다.

const elSpecialWord = document.querySelector('.special-word');

function isRegExp (value, regex) {
  return regex.test(value);
}

if (isRegExp(elInputUsername.value, /\W/)) {
  elSpecialWord.classList.remove('hide');
} else {
  elSpecialWord.classList.add('hide');
}