권형&오형의 일상

⑴ eq 메서드 사용 방법 : 특정 순서의 태그를 선택하거나 순차적으로 접근 가능 $("선택자").eq(번호) 12$("p").eq(1)//p태그들 중 2번째 p태그 선택cs1$("p:nth-child(2)")cs *필터 선택자는 수학적 표현방법에 따라 1번 부터 시작하지만 eq메서드의 경우 자바스크립트의 언어 구조에 따라 0부터 시작 123456789101112131415161718192021 Simple line line line line line line line line line lineColored by Color Scriptercs123456789$(function(){ var p_tag = $("p"); // 태그를 선택해서 변수에 넣음 var p_tag_len = p_tag.lengh; /..

1. 자식 선택자와 자손 선택자 DOM에서 하위 노드가 자식요소의 개념 ⑴ 자식요소의 선택방법(CSS 선택자와 동일한 형태) $("선택자" > 선택자"); 12$("#s1>p");//#s1의 자식 요소인 태그를 선택하는 경우cs ⑵ 메서드를 사용하는 방법 : 이 때 사용하는 메서드는 '선택'역할 수행 css의 :nth-child(n)과 동일 * 자식 요소 선택 $("선택자").children("선택자");12$("#s1").children("p1");//#s1의 자식 요소인 태그를 선택하는 경우cs 12$("#s1").children();//자식요소 전부 선택cs * 자손 요소 선택 $("선택자").find("선택자"); 12$("선택자").find("선택자");//해당 태그에 속한 요소중 원하는 것을 ..

jQuery의 코드는 선택자와 메서드의 조합으로 구성되는 경우가 많다. 선택자는 HTML의 태그를 쉽게 선택해서 jQuery를 통해 기능을 구현할 수 있도록 만들어준다. $("선택자") $("선택자").메서드(매개변수, 함수 등) 12$("span").hide();//모든 span태그 선택 후 숨기는 기능을 수행하는 메서드 실행cs 기본 선택자 전통적인 자바스크립트에서 사용되었던 아이디 선택, 이름 선택과 같으나 더 확장된 형태를 지원한다. .p1{ color : red;}$ ( ".p1") .css ('color','red' );CSSjQuery 종류형태전체 선택자*태그 선택자태그아이디 선택자#아이디클래스 선택자.클래스 1234567891011121314 title some... 123$(functio..

jQuery 키워드 치환 123$(document).ready(function(){ //실행할 코드}); 12$("p")jQuery("p") $와 jQuery를 구분해서 사용하는 경우$ 문자 치환의 경우 jQuery 라이브러리에서만 사용되지 않는다. 다른 자바스크립트 라이브러리(Prototype 등)에서도 사용되므로 두 개 이상의 자바스크립트 라이브러리를 사용한다면 라이브러리 간에 충돌이 생길 수있다.→ 이 경우에는 $ 치환을 해서는 안된다. 일반적으로는 jQuery 라이브러리 하나만 사용하기 때문에 $문자를 사용하면 된다. $(document).ready()의 단축 형태 123$(function(){ //실행할 코드}); 1234567891011 Simple Colored by Color Scripte..

jQuery(document).ready()화면에 페이지가 로딩된 후 실행되도록 하는 대표적인 명령어 123jQuery(document).ready(function(){ //실행할 코드}); 화면 구성완료 이벤트 + 실행함수(HTML 로드 완료) 사용자가 작성하는 코드들은 시작 시점이 정해져 있어야 함. (시작 시점이 없으면 코드가 언제 실행되어야 하는지 모르기 때문)가장 대표정인 시작 시점은 화면에 페이지가 로딩 된 후(가장 기본적)이다. 123window.onload = function(){ alert("");} 123jQuery(document).ready(function(){ alert("");}); 자바스크립트(고전 모델) 브라우저 별, 버전별로 이벤트 처리에 차이가 생김.제이쿼리 1234567..

객체.메서드 1. 객체를 선택$(선택자).메서드$("p").메서드 2. 생성한 객체 사용 객체.메서드 12var obj ={}; //객체 생성obj.메서드; //javascript와 동일한 구조로 사용가능. 3. 메서드 체이닝 : 메서드를 여러개 연결해서 사용 객체.메서드1.메서드2 자바스크립트에서는 사용에 제한이 있지만, jQuery에서는 대부분의 구조에서 사용할 수 있다.

1. jQuery 정의 : 자바스크립트 라이브러리 2. jQuery 특징 ⑴ 브라우저 호환성 : jQuery 가 알아서 브라우저 별로 실행되도록 내부적으로 처리하므로 브라우저의 특징을 생각하지 않아도 된다. ⑵ 쉬운 DOM 처리 : DOM구조는 요소에 접근하는 방법도 적고 해당 요소를 제어하는 방법도 불편하다. 특히 제어 방법마다 다른 방식을 가지므로, 기억하기도 힘들고 오류가 생길 수도 있다. jQuery는 DOM구조에 쉽게 접근하고 제어할 수 있다. ⑶ 쉬운 이벤트 처리 : 이벤트 종류별로 사용 방법이 다르기도 하며, 적용될 DOM 요소에 따라서 사용 가능한 이벤트가 정해져있다. jQuey는 이러한 제약이 없다. ⑷ 쉬운 시각 효과 구현 ⑸ 쉬운 AJAX 기능 구현 : AJAX를 활용한 서버 통신 페..