출처 : https://www.w3schools.com/jquery
ㅁjQuery의 특징
jQuery는 자바스크립트 라이브러리이다.
jQuery는 자바스크립트 프로그래밍을 아주 단순화한다.
jQuery는 배우기 쉽다.
클릭하면 문자가 없어지는 예제 소스
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | <!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script> $(document).ready(function(){ $("p").click(function(){ $(this).hide(); }); }); </script> </head> <body> <p>If you click on me, I will disappear.</p> <p>Click me away!</p> <p>Click me too!</p> </body> </html> | cs |
ㅁ jQuery 인트로
jQuery의 목적은 자바스크립트를 사용하기 쉽게 하는 것이다.
ㅁ jQuery란?
jQuery는 가볍고, 적게 쓰고, 더 많은 기능을 사용할 수 있는 자바스크립트 라이브러리이다.
ㅁ jQuery 문법
jQuerys는 HTML 태그를 선택하고 태그의 액션을 수행하는데 안성 맞춤이다.
가장 기본적인 문법은 $(selector).action() 이다.
- $ 기호는 jQuery를 정의/접근 하는 기호이다.
ex)
$(this).hide() - 현재 태그를 숨긴다
$("p").hide() - p 태그를 숨긴다
$(".test).hide() - "test" 클래스의 모든 태그를 숨긴다
$("#test").hide() - id가 "test"인 모든 태그를 숨긴다
** jQuery는 태그 선택을 위해 CSS 문법을 사용한다.
ㅁ 문서 준비 이벤트
1 2 3 4 5 | $(document).ready(function(){ // jQuery methods go here... }); | cs |
이 형식은 문서 로딩이 끝나기 전에 jQuery 코드가 실행되는 것을 예방한다.
jQuery팀은 또한 심지어 더 짧은 방법 또한 만들었다.
1 2 3 4 5 | $(function(){ // jQuery methods go here... }); | cs |
'문돌이의 IT > jQuery' 카테고리의 다른 글
| jQuery Effects 제이쿼리 효과 - hide and show (0) | 2017.08.08 |
|---|---|
| jQuery event 제이쿼리 이벤트 (2) (0) | 2017.08.07 |
| jQuery event 제이쿼리 이벤트 (1) (0) | 2017.08.06 |
| 다양한 jQuery 셀렉터들 (Selector) (0) | 2017.07.27 |
| jQuery 셀렉터 (Selector) (3) | 2017.07.26 |