박지연의 코딩이야기

HTML Hello World! Javascript 1 ) className 속성 사용 // 요소 선택const element = document.querySelector(".old-class");// 클래스 이름 변경element.className = "new-class";  2) classList 속성을 사용  2-1. 클래스 추가 (add) element.classList.add("new-class"); 2.2. 클래스 제거 (remove)element.classList.remove("old-class");  2.3. 클래스 교체 (replace)element.classList.replace("old-class", "new-class"); 2.4. 클래스 토글 (toggle)element.cla..

HTML HTML CSS CSS3 JavaScript jQuery  Javascriptvar li = document.querySelectorAll("#tutorial li");for (var i = 0; i   JavaScript 코드 설명querySelectorAll로 모든 요소 선택:document.querySelectorAll("#tutorial li")는 #tutorial ID를 가진 의 모든 요소를 NodeList로 반환합니다.for 루프로 각 요소 순회:루프를 사용해 각 요소의 클래스 이름(className)을 확인합니다.slice 메서드로 문자열 자르기:className.slice(0, 3)로 클래스 이름의 처음 3문자를 추출합니다.조건문 if (na..

HTML 1 2 3 4 Javascript // 모든 li 태그를 가져옵니다.var items = document.getElementsByTagName("li");// 각 li 태그의 색상을 변경합니다.for (var i = 0; i 설명document.getElementsByTagName("li")는 모든 요소를 HTMLCollection으로 반환for 루프를 통해 모든 요소를 순회하며 스타일을 변경items[i].style.color = "red";로 각 요소의 텍스트 색상을 빨간색으로 설정함결과페이지를 실행하면 요소의 텍스트 색상이 빨간색으로 변경됩니다! 😊 추가 Tip (코드 효율성)최신 JavaScript에서는 querySelectorAll과 forEach를 사용..