D-23 DOM classList.toggle

So Eun Ahn·2021년 2월 4일
0

JavaScript

목록 보기
26/26
post-custom-banner

element.classList.toggle

toggles between a class name for an element.

클래스 값을 토글링한다.
클래스가 존재한다면 delete하고 false를 return하며, 존재하지 않으면 클래스를 add하고 true를 return한다

Return Value: A DOMTokenList, containing a list of the class name(s) of an element

Remove a class:

element.classList.toggle('', false);

Add a class:

element.classList.toggle('', true);

element.classList.toggle('');
element.classList.add('');
element.classList.remove('');

Recap

Conditional (ternary) operator

let activePlayer = 0;
activePlayer = activePlayer === 0 ? 1 : 0;

condition: activePlayer 값이 0 이 되면
return 1
condition: activePlayer 값이 0 이 아니면
return 0

Syntax

condition ? exprIfTrue : exprIfFalse

Same as

function example(…) {
    return condition1 ? value1
         : condition2 ? value2
         : condition3 ? value3
         : value4;
}

// Equivalent to:

function example(…) {
    if (condition1) { return value1; }
    else if (condition2) { return value2; }
    else if (condition3) { return value3; }
    else { return value4; }
}
profile
오늘도 새로운 도전을 한다
post-custom-banner

0개의 댓글