note

클래스 선택자 본문

JavaScript/jQuery

클래스 선택자

투한 2012. 3. 19. 10:55





11라인 주석 제거후





<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<script src="http://code.jquery.com/jquery-1.7.js"></script>
<script>
	$(document).ready(function (){
		$('.item').css('color','Orange');
		//$('h1.item').css('background','red');
	});
	
</script>
<body>
	<h1 class="item">Header-0</h1>
	<h1 class="item select">Header-1</h1>
	<h1 class="item">Header-2</h1>
</body>
</html>







class명이 item일 경우 스타일 적용


h1태그에 접근하여 item에 접근 







두 가지 클래스를 모두 가지는 태그 선택









<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<script src="http://code.jquery.com/jquery-1.7.js"></script>
<script>
	$(document).ready(function (){
		$('.item.select').css('color','Orange');
	});
	
</script>
<body>
	<h1 class="item">Header-0</h1>
	<h1 class="item select">Header-1</h1>
	<h1 class="item">Header-2</h1>
</body>
</html>

더 깊게 접근할 수 있다



저작자표시 비영리 변경금지 (새창열림)

'JavaScript > jQuery' 카테고리의 다른 글

속성 선택자  (0) 2012.03.20
자식 선택자  (0) 2012.03.20
ID 선택자  (0) 2012.03.19
태그 선택자  (0) 2012.03.19
전체 선택자  (0) 2012.03.19
'JavaScript/jQuery' Related Articles more