$()로 축약해서 사용 가능
달러($)기호는 jQuery를 의미하고, jQuery에 접근할 수 있게 해주는 식별자
$()안에는 선택하고 싶은 것이 들어간다. 이걸 선택자라고 부름.
선택자(Selector)는 선택을 해주는 요소이고, HTML에서 태그, 클래스, id같은 것을말함.
jQuery 함수의 기본 형식
$(선택자).동작함수();
가장 많이 사용되는 선택자
1. .클래스이름
2. #아이디이름
3. 태그
$("태그명").동작함수() $(".클래스명").동작함수() $("#id명").동작함수()
달러($)표시 안에 태그명만 그냥 쓰면 태그를 가리키게 되고, .은 클래스, 그리고 # 은 id를 가리킴.
$( ".csstest" )
class이름이 csstest인 애들을 선택
$( "div" )
아무것도 없이 이름만 쓰면 그 이름인 태그를 불러오는 것
(지금은 모든 div태그를 선택)
$( "div > div" )
$( "div div" )
1번처럼 사용했다면 div태그 바로 아래 자식 중에 div태그인 애를 모두 선택
2번처럼 사용했다면 div태그의 자식인 div뿐만 아니라 자식의 자식, 후손 중 div태그를 모두 선택
<html>
<head>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
</head>
<body>
<div>
<h1>dd</h1>
</div>
<div>
<span>
빠이
<div>안녕</div>
</span>
</div>
</body>
</html>
안녕이 들어간 div를 선택하기 위해서는 $( "div div" )
을 사용
딱 하나를 지정하고 싶다면?
$( "div > span > div" )
div태그자식중span을선택하고그span의자식중div를선택
( "#yes > div ) ☞ yes 라는 아이디를 가진 태그 바로 아래 자식 중 div 태그 선택
클래스 아래 자식들 중 태그선택, 아이디아래 자식 선택 등의 작업 가능
복습:
7.jQuery에서 div 태그에 "myclass"라는 클래스를 추가하는 코드는 무엇인가요?
$("div").addClass("myclass");