* 결과
'프로그래밍 > jQuery' 카테고리의 다른 글
| 2012-6-5 02_table.html[실습] (0) | 2012.06.05 |
|---|---|
| 2012-6-5 jQuery event메소드 (0) | 2012.06.05 |
| 2012-6-5 jQuery cssTest[실습] (0) | 2012.06.05 |
| 2012-6-5 selector를 이용한 HTML구조 접근 (0) | 2012.06.05 |
| 2012-6-4 jQuery개요 및 기본문법 (0) | 2012.06.04 |
jquery_src_tempalate1.zip
'프로그래밍 > jQuery' 카테고리의 다른 글
| 2012-6-5 02_table.html[실습] (0) | 2012.06.05 |
|---|---|
| 2012-6-5 jQuery event메소드 (0) | 2012.06.05 |
| 2012-6-5 jQuery 03_selector_attr.html[실습] (0) | 2012.06.05 |
| 2012-6-5 selector를 이용한 HTML구조 접근 (0) | 2012.06.05 |
| 2012-6-4 jQuery개요 및 기본문법 (0) | 2012.06.04 |
기본 문법
• jQuery 라이브러리 등록
– <script>로 다운받은 파일 등록
– URL로 등록
• <script src="http://code.jquery.com/jquery-latest.js">
• Selector함수
– jQuery 함수를 적용할 요소를 찾는 함수
– jQuery(“selector”) 또는 $(“selector”)
• Selector함수.jQuery커맨드
– jQuery커맨드는 jQuery가 지원하는 메소드임
– jQuery Chain
• 예
– jQuery(“#layer”).html(“안녕”);
– $(“p”).css(“color”, “red”).css(“background”, “blue”);
• jQuery 라이브러리 등록
– <script>로 다운받은 파일 등록
– URL로 등록
• <script src="http://code.jquery.com/jquery-latest.js">
• Selector함수
– jQuery 함수를 적용할 요소를 찾는 함수
– jQuery(“selector”) 또는 $(“selector”)
• Selector함수.jQuery커맨드
– jQuery커맨드는 jQuery가 지원하는 메소드임
– jQuery Chain
• 예
– jQuery(“#layer”).html(“안녕”);
– $(“p”).css(“color”, “red”).css(“background”, “blue”);
Selector를 이용해 HTML구조 접근
• 구조 태그 (HTML 태그) 와 Javascript 분리
– 동작을 HTML에 적용하기 위해 HTML 태그에 접근할 필요
– CSS기본 selector나 jQuery 정의 selector이용해 접근
• CSS selector 예
body{
background-color:#D024FE;
}
div#message_layer{
font-color:red;
}
jQuery 기본문법 – selector 예
• $(‘a’) – page 내 모든 <a>
• $(‘div a’) – page 내 <div> 하위에 있는 <a>
• $(‘#test’) – id가 test인 태그
• $(‘.btn’) – class가 btn인 모든 태그
• $(‘tr:odd’) - <tr> 태그들 중 홀수번째들
• $(‘tr:last’) – 문서내의 마지막 <tr>
• $(‘b:contains(‘hi’)) – hi를 content로 가진 b태그
• $(‘div:has(‘ul’)) - <ul>을 가진 <div> 태그
• $(‘input:checkbox’) – input태그중 checkbox
• $(‘td nth-child(2n)’) –2의 배수 번째 <td>
$(document).ready(callback 함수)
• jQuery 이벤트 메서드 중 하나
• 문서의 DOM 요소들을 조작 할 수 있는 시점에서 호출
• javascript의 load 이벤트와 비슷
• 예
$(document).ready(function(){
alert('a');
}
);
'프로그래밍 > jQuery' 카테고리의 다른 글
| 2012-6-5 02_table.html[실습] (0) | 2012.06.05 |
|---|---|
| 2012-6-5 jQuery event메소드 (0) | 2012.06.05 |
| 2012-6-5 jQuery 03_selector_attr.html[실습] (0) | 2012.06.05 |
| 2012-6-5 jQuery cssTest[실습] (0) | 2012.06.05 |
| 2012-6-4 jQuery개요 및 기본문법 (0) | 2012.06.04 |
