[jQuery] 기본 문법

라이브러리란? (library)

 

jQuery란?

외부 라이브러리

 

사용방법

1. 직접 서비스 하는 경우

2. 구글의 자바스크립트 라이브러리를 사용하는 경우 (CDN)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

 

기본문법

$$(선택자).action(할일);  ===> 할 일은 익명의 함수객체로 표현
                                   function(){}
                     action=이벤트함수

$('선택자').action(function(){});  

 

 

$('a.b')	<a>엘리먼트 중 <a class='b'>인 엘리먼트 들  ==> <a>태그
$('a,b')	<a> 또는 <b> 엘리먼트 들                         ==> <a>태그, <b>태그
$('a b')	<a>를 부모로 갖는 <b>엘리먼트들              ==> <b>태그                a:조상 b:후손
$('a > b')	<a>를 부모로 갖는 <b>엘리먼트들            ==> <b>태그                a:부모  b:자식
$('[href]')	현재 속성값으로 href속성이 있는 엘리먼트 들                 예)   <a>텍스트</a>               : 미적용                        <a href="경로">텍스트</a>    : 적용                        <link href="경로">          : 적용
$('a[href]')	<a>엘리먼트 중 href속성이 있는 엘리먼트 들                 예)    <a href="경로">텍스트</a>    : 적용                         <link href="경로">          : 미적용
$('*')	HTML문서를 구성하는 모든 엘리먼트 들
$(this)	보통 이벤트를 발생시킨 한 개의 엘리먼트를 표현
$('li:first')	첫번째 <li>엘리먼트
$('ul li:first')	<ul>의 자식 <li>중 첫번째 <li>엘리먼트 한개 <ul>          <li>      <------- 적용          <li>        </ul>           <ul>          <li>      <------- 미적용          <li>        </ul>
$('ul li:first-child')	각각의 <ul>의 자식 <li>중 첫번째 <li>엘리먼트 한개     <ul>          <li>      <------- 적용          <li>        </ul>           <ul>          <li>      <------- 적용          <li>        </ul>
$(':button')	<input type=button>과 <button>엘리먼트 들
$('tr:even') $('tr:odd')	<table>       <tr></tr>  0    <---- even       <tr></tr>  1    <---- odd       <tr></tr>  2    <---- even       <tr></tr>  3    <---- odd    </table>

 

<table>
   <tr></tr>  0    <---- even
   <tr></tr>  1    <---- odd
   <tr></tr>  2    <---- even
   <tr></tr>  3    <---- odd
</table>