[javascript] HTML attribute 적용하기 (속성형태, 객체형태)

공부하면서 정리한 내용입니다
참고한 내용은 맨 아래의 링크를 확인해주세요

---

속성형태 (setAttribute, getAttribute)

Array.from([전체배열값]).forEach((각배열값)=>{
    각배열값.addEventListener("click", ()=>{

        각배열값.setAttribute("속성", "값");  // set
        각배열값.getAttribute("속성");       // get 
    }
}

// Style 적용
element.setAttribute("style", "키:값; 키:값"); 
element.getAttribute("style");      

// checked 확인
element.setAttribute("checked", boolean ); 
element.getAttribute("checked");

객체형태

let 선택요소 = documnet.querySelector("정확하게 선택된 요소");

선택요소.속성 = "value"
선택요소.속성.key = "value"      
선택요소.속성[key] = "value"

// Style 적용
if(element.style.display === "none"){       // 조건문에서도 사용 가능 

    element.style.display = "inline-block"; // 조건문과 함께 토글기능처럼 활용하기
    element.style["min-height"] = "100px";  // 옵션명에 하이픈을 사용하는 경우, 대괄호 사용가능
}

// checked 확인
element.checked = boolean;      // set
console.log(element.checked);   // get

---