IT 개발/web 개발

javascript - 자동으로 바뀌는 HTML로 로그인 시 필요한 텍스트 숫자를 실시간으로 바꿔보자. '제어구조' 시작하기

여행과 투자 2025. 6. 22. 10:31
728x90
반응형

HTML에 텍스트 박스를 만들고,

그 안에 글자를 칠 수록 카운팅 되는 javascript 코드를 만들어 보자

 

const myName = 'Max';

if (true) {
    console.log('Hello!');
}

현재 if문 기준에서는 () 안이 항상 true로 설정되어 있기 때문에 참 이든 거짓 이든 항상 '참'으로 인식되고 있어

if 문 이하의 console.log가 실행된다

 

따라서 myName에 들어간 값이 제대로 'Max'인지 확인하려면

const myName = 'Max';

if (myName ==='Max') {
    console.log('Hello!');
}

if 안의 값이 참인지 거짓인지 구별할 수 있도록 변경해 줘야 한다

 

이제 js문서에서 텍스트 안의 문자를 쓸 수 있는 양이 10개 이하라면 'warning' 기능이 작동하고, 10개 초과라면 기능이 해제되도록 해보자

    if (remainingCharacters<=10) {
        remainingCharsElement.classList.add('warning');
        productNameInputElement.classList.add('warning');
    } else{
        remainingCharsElement.classList.remove('warning');
        productNameInputElement.classList.remove('warning');
    }

 

728x90
반응형