classList
-
JavaScript 입문 : className과 classList 사용법 - 응용컴퓨터 알아가기/JavaScript 2022. 7. 24. 19:30
자바스크립트에서 className과 classList에 대한 간단한 문법을 익혀 보았는데요. 간단한 예제를 통해서 응용을 해 보도록 히겠습니다. 브라우저상에 문장을 클릭하면 글씨색이 변하는 내용을 자바스크립트를 통해서 만들고자 합니다. HTML상 클래스명을 지정하지 않고 색이 변할때마다 클래스명을 추가하면서 자바스크립트 명령어를 사용하고자 합니다. 이럴경우 classList에 add명령어를 사용하여 진행해야 하는데 단순하게 className을 사용하여 진행하는 실수를 법하게 되는데 다음 예를 통하여 확인할 수 있습니다. 1. className을 잘 못 사용하는 예 기본 HTML / CSS 및 JS를 다음과 같이 만들어서 브라우저 변화를 보도록 하겠습니다. JS에서는 className을 사용하여 태그상 클..
-
JavaScript 입문 : className과 classList 사용법 - 기본문법컴퓨터 알아가기/JavaScript 2022. 7. 23. 19:30
저같이 초보인 경우 자바스크립트를 배우는 과정에서 어렴풋하게나마 이해하고 있는 clasName과 classList에 대하여 좀 더 명확하게 정의하고 갈 필요를 느끼게 되어 이 기회에 정리를 하고자 합니다. 사실 저는 HTML / CSS에서 class를 자바스크립트에서는 className으로 불리운다는 사실만 알았고 그 쓰임새를 별로 신경쓰지 않았는데 기초 과정에서 조차 여러가지 쓰임새가 발견이 되어 예제를 가지고 이해를 해보도록 하겠습니다. 아울러, 각종 예에서 사용되는 경우가 있으면 Case by Case로 그때 그때 정리하고자 합니다. ▒ className 1. 기본형 자바스크립트에서는 className은 HTML/CSS에서 class와 같은 개념입니다. 가장 기본적인 사용법은 HTML상 class ..