jQuery 에서는 .css로 간단하게 css를 수정, 삭제, 추가 할 수 있다.
css를 새로 추가하거나 변경하는 방법은 같다.
CSS 추가 및 변경
$('h1').css('color','blue');
h1태그에 추가하고 싶은 css를 입력하고 두번째로 값을 입력해 주면 된다.
CSS 삭제
$('h1').css('color','');
삭제를 하고싶다면 그냥 빈 값을 입력해주면 된다.
테스트 소스
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>
<body>
<h1 style="color:red">테스트</h1>
<button id="b1">css추가 or 변경</button>
<button id="b2">css삭제</button>
<script>
$(document).ready(function(){
setEvt();
});
function setEvt(){
$('#b1').click(function(){
$('h1').css('color','blue');
});
$('#b2').click(function(){
$('h1').css('color','');
});
}
</script>
</body>
</html>
'프로그래밍 > jQuery & javaScript' 카테고리의 다른 글
eval 함수 - 문자열을 소스 코드로 (0) | 2019.11.13 |
---|---|
[jQuery] 동적 태그에 이벤트 등록 (0) | 2019.10.28 |
[jQuery] 요소 삭제 remove와 empty (0) | 2019.09.10 |
[jQuery] html 동적 태그 추가하기 (2) | 2019.09.10 |
자바스크립트 날짜 계산(년, 월, 일, 시, 분, 초) (0) | 2019.08.22 |