728x90 300x250 SMALL javaScript/J Query & 스크립트138 class 추가, 삭제, 토글 javaScript classList.add 요소에 클래스 추가 element.classList.add('className'); //여러개 클래스도 추가가능하다 (IE11 지원안함) element.classList.add('className1', 'className2', 'className3'); classList.remove 요소로부터 해당 클래스 제거 element.classList.remove('className'); // 여러개 클래스 제거 (IE 11 지원안함) element.classList.remove('className1', 'className2', 'className3'); classList.toggle 클래스 토글 기능 element.classList.toggle('className'); 예제 코드 See.. 2022. 5. 6. HTML DOM 컨트롤 vanilla 자바스크립트 코드 모음 vanilla javaScript로 HTML DOM을 관리 할 수 있는 코드 모음 사이트 https://htmldom.dev/ Manage HTML DOM with vanilla JavaScript Manage HTML DOM with vanilla JavaScript htmldom.dev 2022. 5. 2. JavaScript 아이디(id), 태그(tag), 클래스(class) 찾기 아이디(ID) 찾기 - getElementByid() ID를 찾아서 반환 var elem = document.getElementById('idName'); 클래스(Class) 찾기 - getElementsClassName() 실시간으로 업데이트되는 해당 클래스 명을 가진 모든 요소 목록의 HTML Collection이 반환된다. 클래스는 여러개이기 때문에 HTML Collection 객체로 배열같은 형태로 가져온다. 따라서 사용할때는 배열처럼 인덱스 값을 붙여줘야 한다. 단일클래스 찾기 document.getElementsByClassName('className'); 여러개 클래스를 가진 요소 찾기 document.getElementsByClassName('className select'); main이라.. 2022. 4. 29. javaScript 데이터 타입 확인하기 javaScript에서 데이터 타입을 확인하기 위해서는 typeof연산자를 이용하면 된다. const name = "moo"; console.log(typeof name); //string 위와 같이 데이터 타입을 확인하고 싶은 변수 앞에 typeof 연산자를 입력하면 name 변수의 데이터 타입 string이 표시되는 걸 확인할 수 있다. 위와 같은 방법으로 string 뿐만 아니라 number, boolean, null, undefined의 데이터 타입도 확인해 볼 수 있다. const name = "moo"; const age = 62; const isMale = true; const x = null; const n = undefined; console.log(`${name} = ${typeof n.. 2022. 4. 26. 이전 1 ··· 7 8 9 10 11 12 13 ··· 35 다음 728x90 반응형 LIST