JavaScript/javascript javascript style, css 여러개 처리 - 반응형 javascript 를 사용해 DOM Element 요소를 불러와 style 및 css 를 처리가 필요할때가 있다. 보통 한개의 css style 을 처리해야할 땐 아래와 같이 한다. document.getElementById('styleId').style.display = 'none';document.getElementById('styleId').style.color = 'red'; 하지만 DOM Element 의 style 데이터가 여러개일 경우와 여러개를 변경 해야할 때가 있는데 이때 문자열을 사용하는 cssText() 를 사용한다. cssText() 는 문자열을 사용해 불러온 Element 의 전체 스타일을 변경하기 때문에 주의해야 한다. document.getElementById('id값').style.cssText = "바꿀 css 데이터"; 예시 1) 아래와 같이 style 데이터가 "color: red; display: block;" 인 ul 태그가 있다. console.log(document.getElementById("exceptiondayTime").style.cssText); 결과는 아래와 같다. 불러온 Element 의 style 요소 전체를 문자열 형태로 반환하는걸 볼 수 있다. 실제 사용 예시는 아래와 같다. 변경전 cssText 를 통해 전체 데이터를 불러오고 cssText 에 "color: blue" 값을 넣으면 아래와 같이 전체 style 데이터가 바뀌는걸 확인할 수 있다. console.log(document.getElementById("exceptiondayTime").style.cssText); document.getElementById("exceptiondayTime").style.cssText = "color: blue"; console.log(document.getElementById("exceptiondayTime").style.cssText); 반응형 좋아요공감공유하기 URL 복사카카오톡 공유페이스북 공유엑스 공유 게시글 관리 구독하기공부하자! Contents 당신이 좋아할만한 콘텐츠 Javascript 전화번호 하이픈 자동 삽입 2023.11.28 Javascript 실행 컨텍스트와 렉시컬 스코프, 스코프 체인 2023.08.08 Javascript 클로저 2023.08.02 Javscript 배열(Array)과 유사 배열 객체 2023.07.31 댓글 0 + 이전 댓글 더보기 공부하자!BBB.OOO 님의 블로그입니다.구독하기