자바스크립트에서 Ternary 연산자를 사용한 강조 효과 구현

간단한 조건문을 통해 요소에 강조 효과를 지정하고 싶다면, 자바스크립트의 Ternary 연산자를 사용할 수 있습니다.

Ternary 연산자는 다음과 같은 형식으로 작성됩니다.

(condition) ? expression1 : expression2;

조건(condition)이 true인 경우 expression1이 실행되고, false인 경우 expression2가 실행됩니다.

다음은 Ternary 연산자를 사용하여 요소에 강조 효과를 추가하는 예시 코드입니다.

const element = document.querySelector('.my-element');
const isActive = true;

element.style.backgroundColor = isActive ? 'red' : 'blue';

위 코드에서는 조건 isActive이 true인 경우 요소의 배경색이 빨간색으로 설정되고, false인 경우에는 파란색으로 설정됩니다.

Ternary 연산자를 사용하면 간단한 조건문을 더욱 간결하게 표현할 수 있습니다. 다른 상황에 따라 다양한 스타일을 적용할 수 있는 강조 효과를 구현할 때 유용하게 사용할 수 있습니다.

이렇게 자바스크립트의 Ternary 연산자를 활용하여 간결하고 유연한 강조 효과를 구현해보세요!

참고 자료