Links

조건문 ( if , else, and, or)

if

if 조건은 항상 참이어야함
if(10 === 5){ // 5보다 10이 큰지 체크함
// 만약 10 > 5 -> hi 출력
console.log("hi")
}else if(10 === "10"){
console.log("ho")
}
else{
console.log("no") // no 출력
}
if(20 > 5 && "boo" ==== "boo"){
// && 두가지의 조건이 다 충족되야함
// || or이라서 하나만 충족되도됨
console.log("yes") // yes 출력
}else{
console.log("no")
}
const age = prompt(" 몇살이야? ");
if(age >= 18 && age <= 21 ){ // 18살 21사이 일때
console.log(" you can drink you shold not");
}else if(age > 21){ //21살보다 많을때
colsole.log(" go ahead ")
}else{// 두조건이 다 아닐때
console.log(" too young ");
}

if else

const title = dociment.querySelector("#title");
const BASE_COLOR = "#999";
const OTHER_COLOR = "#7F8CD";
function handleClick(){
const cureenColor = title.style.color;
if(cureenColor === BASE_COLOR){
title.style.color = OTHER_COLOR; //false
}else{
title.style.color = BASE_COLOR ; // 클릭하면 #999로 바뀜
}
}
function inlit(){
title.style.color = BASE_COLOR;
title.addEventListener("click" handleClick); // "mouseenter" -> 마우스를 대면 색상이 바뀜
// 많은 DOM 이벤트가 있다 NDN참조하기
}
inlit();
const title = dociment.querySelector("#title");
const CLICKED_CLASS = "clicked";
function hadle(){
const currentCalss = title.className;
if(currentCalss !== CLICKED_CLASS) {//currentCalss 와 CLICKED_CLASS 같지 않을때
title.className = CLICKED_CLASS; // clicked class가 붙어서 해당 css가 실행이 됨
}else{
title.className = "";
}
};