jQuery 셀렉터는 jQuery 라이브러리의 가장 중요한 부분 중 하나입니다.
jQuery 셀래터를 사용하면 HTML 요소를 선택하고 조작 할 수 있습니다.
이름,ID,클래스,유형,속성,속성 값 등을 기반으로 HTML 요소를 찾거나 선택하는데 사용됩니다.
jQuery의 모든 선택자는 달러 기호와 괄호로 시작합니다. $().
요소 셀렉터
jQuery 요소 셀렉터는 요소 이름을 기반으로 요소를 선택합니다.
페이지의 모든 <p>요소를 선택합니다.
$("p")
|
1
2
3
4
5 |
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
}); |
cs |
사용자가 버튼을 클릭하면 모든 <p>요소가 숨겨집니다.
#id 셀렉터
id는 페이지 내에서 고유해야하므로 단일 고유 요소를 찾으려면 #id selector를 사용해야합니다.
$("#test")
|
1
2
3
4
5 |
$(document).ready(function(){
$("button").click(function(){
$("#test").hide();
});
}); |
cs |
사용자가 버튼을 클릭하면 id="test"인 요소가 숨겨집니다.
.class 셀렉터
$(".test")
|
1
2
3
4
5 |
$(document).ready(function(){
$("button").click(function(){
$(".test").hide();
});
}); |
cs |
사용자가 버튼을 클릭하면 class="test"인 요소가 숨겨집니다.
웹 사이트가 점점 커져 많은 페이지가 생기게 됩니다.
jQuery 함수를 쉽게 유지하려면 별도의 .js 파일에 넣는 것이 좋습니다.
|
1
2
3
4
5 |
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
</script>
<script src="my_jquery_functions.js"></script>
</head> |
cs |
출처:https://www.w3schools.com/jquery
'똥 싸기 > jQuery' 카테고리의 다른 글
| [jQuery]숨기기/표시 (0) | 2017.09.13 |
|---|---|
| [jQuery]이벤트 (0) | 2017.09.11 |
| [jQuery]구문 (0) | 2017.09.11 |
| [jQuery]사용방법 (0) | 2017.09.11 |
| [자바스크립트]자바스크립트 소개 (0) | 2017.08.27 |