분류 전체보기
-
[jQuery] 25. AJAX load - jQuery 강좌 jQuery / CSEWeb/jQuery 2015. 6. 13. 11:29
jQuery - AJAX load() Method 1. jQuery load() Method load() 메소드는 간단하면서도 강력한 AJAX 메소드 입니다. load() 메소드는 서버로 부터 데이터를 로드하고, 선택된 요소에 반환된 값을 넣습니다. 문법:$(selector).load(URL,data,callback); 필수적인 URL 파라미터는 로드를 원하는 URL을 명시합니다. 선택적인 data 파라미터는 요구와 함께 보내지는 키 / 값 쌍의 일련의 질의 문자열을 명시합니다. 선택적인 callback 파라미터는 load() 메소드가 끝나고 난 뒤 실행될 함수의 이름입니다. 아래 "demo_test.txt"라는 텍스트 예제 파일이 있습니다. jQuery and AJAX is FUN!!! This is ..
-
[jQuery] 24. AJAX - jQuery 강좌 jQuery / CSEWeb/jQuery 2015. 6. 13. 11:29
jQuery - AJAX Introduction AJAX는 서버와의 데이터 교환의 미학이고, 전체 페이지의 리로드 없이 웹 페이지의 일부분을 수정가능 합니다. 1. What is AJAX? AJAX = Asynchronous JavaScript and XML AJAX는 백그라운드에서 데이터를 로딩하는 것이고, 전체 페이지 리로드 없이 웹페이지에 표시하는 것입니다. AJAX를 이용한 어플리케이션의 예: Gmail, Google Maps, Youtube, and Facebook tabs. 2. What About jQuery and AJAX? jQuery는 AJAX 기능성을 위한 몇 가지 메소드를 제공합니다. HTTP Get 이나 HTTP Post를 사용하여 외부 서버로 부터 text, HTML, XML 이..
-
[jQuery] 23. Filtering - jQuery 강좌 jQuery / CSEWeb/jQuery 2015. 6. 13. 11:28
jQuery Traversing - Filtering 1. Narrow Down The Search For Elements Filtering 메소드의 가장 기본적인 3 가지는 first(), last(), eq() 입니다. 2. jQuery first() Method first() 메소드는 선택된 요소의 첫번째 요소를 반환합니다. 12345678910111213141516171819202122232425262728293031$(document).ready(function(){ $("div p").first().css("background-color", "yellow");}); Welcome to My Homepage This is the first paragraph in body. This is the ..
-
[jQuery] 22. Siblings - jQuery 강좌 jQuery / CSEWeb/jQuery 2015. 6. 13. 11:27
jQuery Traversing - Siblings 형제(Siblings)는 같은 부모를 공유합니다. 1. Traversing Sideways in The DOM Tree DOM 트리에서 옆으로 항해하는 여러가지 메소드가 있습니다: - siblings() - next() - nextAll() - nextUntil() - prev() - prevAll() - prevUntil() 2. jQuery siblings() Method siblings() 메소드는 선택된 요소의 모든 형제 요소를 반환합니다. 아래 예제는 의 모든 형제 요소를 반환합니다. 1234567891011121314151617181920212223242526272829303132.siblings * { display: block; borde..
-
[jQuery] 21. Descendants - jQuery 강좌 jQuery / CSEWeb/jQuery 2015. 6. 13. 11:27
jQuery Traversing - Descendants 1. Traversing Down the DOM Tree DOM 트리에서 내려가기 위한 2 가지 유용한 jQuery 메소드가 있습니다: - children() - find() 2. jQuery children() Method children() 메소드는 선택된 요소의 모든 직후 자식들을 반환합니다. 이 메소드는 DOM 트리의 단일 레벨 아래만 항해합니다. 123456789101112131415161718192021222324252627282930313233.descendants * { display: block; border: 2px solid lightgrey; color: lightgrey; padding: 5px; margin: 15px;}$..
-
[jQuery] 20. Ancestors - jQuery 강좌 jQuery / CSEWeb/jQuery 2015. 6. 13. 11:26
jQuery Traversing - Ancestors 조상(ancestor)는 부모, 할아버지, 증조-할아버지, 등등 입니다. 1. Traversing Up the DOM Tree DOM 트리를 거슬러 올라가기 위한 3 가지 메소드가 있습니다: - parent() - parents() - parentsUntil() 2. jQuery parent() Method parent() 메소드는 선택된 요소의 직전 부모 요소를 반환합니다. 이 메소드는 DOM 트리의 단일 레벨만 거슬러 올라갑니다. 1234567891011121314151617181920212223242526272829303132333435363738394041 .ancestors * { display: block; border: 2px solid ..
-
[jQuery] 19. Traversing - jQuery 강좌 jQuery / CSEWeb/jQuery 2015. 6. 13. 11:25
jQuery Traversing 1. What is Traversing? jQuery traversing는 다른 요소와 그들의 관계를 기준으로 HTML 요소를 찾는데 사용됩니다. 한 요소 선택을 시작으로 원하는 요소에 도달할때까지 이동하여 찾습니다. 아래 이미지는 구성 트리를 묘사한 것 입니다. jQuery traversing에서, 위로 올라가거나(ancestor), 내려가거나(descendant), 옆으로 이동할 수 있습니다. 위 그림의 설명: - 요소는 의 부모(parent)이고, 모든 것의 조상(ancestor)이다. - 요소는 두 의 부모이고, 의 자식(child)이다. - 왼쪽 요소는 의 부모이고, 의 자식이고, 의 후손(descendant)이다. - 요소는 왼쪽 의 자식이고, 과 의 후손..
-
[jQuery] 18. dimension - jQuery 강좌 jQuery / CSEWeb/jQuery 2015. 6. 13. 11:25
jQuery - Dimensions 1. jQuery Dimension Methods jQuery는 면적을 작업하기 위한 중요한 여러가지 메소드를 가지고 있습니다: - width() - height() - innerWidth() - innerHeight() - outerWidth() - outerHeight() 2. jQuery Dimensions [ 출처: W3Schools ] 3. jQuery width() and height() Methods width() 메소드는 요소의 너비(width)를 설정하거나 반환합니다. height() 메소드는 요소의 높이(height)를 설정하고나 반환합니다. 아래 예제는 div 요소의 너비와 높이를 반환하는 예제입니다. 1234567 $("button").click(..