[JQuery] JQuery ID, class 찾기

 

지난 시간에 JQuery 명령을 통해서 ID를 찾는 방법을 알아봤습니다.

이번에는 ID 뿐만 아니라 class, element를 찾는 방법에 대해서 알아보도록 하겠습니다. ^^

 

간단한 html 예제입니다.

 

<body>
    <div id="test1" class="sample1"></div>
    <div id="test2" class="sample2"></div>
</body>

 

 

1. id 찾기

 

id 찾는 방법은 지난 강좌를 보면 알 수 있듯이 #을 붙입니다.

$("#  +  ID   + ")  이렇게 ID를 찾을 수 있습니다.

 

 

2. class 찾기

 

class 는 html 코드상에서 스타일을 참조할 수 있습니다.

 

<style> 코드상에 지정한 스타일을 등록하면 화면에 스타일대로 표시를 할 수 있습니다.

 

예를 들어 아래와 같이 스타일이 있다고 가정할때,

<style>
bg_green {
    background-color:#00FF00;     // 배경을 푸르게 푸르게~
}
</style>

 

스타일 이름을 class 안에 집어 넣으면 파랗게 표시됩니다.

 

<div class="bg_green">배경이 파래요~</div>

 

적용을 한 코드는 아래와 같이 나타납니다.

 

배경이 파래요~

 

class 사용법에 대해서 잠시 알아봤구요 ^^

 

이제 JQuery에서 class를 찾는 법입니다.

 

class 찾는 방법은 앞에 #이 아닌 .(dot) 을 붙입니다.

$(".  +  ClassName   + ")  잘 보이지 않지만, 마침표 .을 넣어주면 class를 찾을 수 있습니다.

 

 

3. element

 

우리가 html 한줄을 표현할 때, p, div, span 등을 사용하는데 이것을 통채로 적용하거나 찾을 수 있는 방법이 있습니다.

 

id 는 #, class 는 . 이었다면 p, div, span 등의 각 요소들을 찾을 때는 아무것도 입력하지 않으면 됩니다.

 

$("p") 처럼 사용할 수 있습니다.

 

하지만, 일반적으론 각 요소에 직접 값을 넣기 보다는 스타일을 변경할 때 주로 쓰이는 편입니다.

객체를 찾아서 값을 넣는 건 id, class를 더 많이 사용할 것입니다. ^^

 

 

^ㅇ^!!!

 

다음엔 ID 및 Class를 찾는 것에 대해서 좀 더 상세하게 알아보도록 하겠습니다.

특정 ID 밑에 있는 몇 번째 객체를 찾는다는 내용이 될 것입니다.