목록JQUERY (142)
코드랩 레퍼런스
Definition :eq(index) 셀렉터는 선택된 태그의 인덱스 번호를 통해 선택합니다. Syntax $("div:eq(index)").메서드; Compatibility 6 7 8 9 10 11 :eq() Sample1 :eq() 예제입니다. 선택자(Selectors) :eq() 셀렉터는 선택된 태그의 인덱스 번호를 통해 선택합니다. :even 셀렉터는 선택된 태그의 짝수번째 요소를 찾아 선택합니다. :first 셀렉터는 선택된 태그의 첫 번째 요소를 찾아 선택합니다. :gt() 셀렉터는 선택된 태그에서 인덱스보다 큰 인덱스를 가지고 있는 태그를 선택합니다. :header 셀럭터는 제목요소(h1~h6) 태그들을 선택합니다. :lang() 셀렉터는 언어 속성이 설정된 태그를 선택합니다. :last 셀..
Definition :animated 셀럭터는 애니메이션 태그를 선택합니다.. Syntax $("div:animated").메서드; Compatibility 6 7 8 9 10 11 :animated Sample1 :animated 예제입니다. 선택자(Selectors) :eq() 셀렉터는 선택된 태그의 인덱스 번호를 통해 선택합니다. :even 셀렉터는 선택된 태그의 짝수번째 요소를 찾아 선택합니다. :first 셀렉터는 선택된 태그의 첫 번째 요소를 찾아 선택합니다. :gt() 셀렉터는 선택된 태그에서 인덱스보다 큰 인덱스를 가지고 있는 태그를 선택합니다. :header 셀럭터는 제목요소(h1~h6) 태그들을 선택합니다. :lang() 셀렉터는 언어 속성이 설정된 태그를 선택합니다. :last 셀렉터..
Definition 형제들 선택자 다음 형제 모든 태그를 선택합니다.(prev ~ siblings) Syntax $("div ~ ul").메서드; Compatibility 6 7 8 9 10 11 Next Siblings Sample1 형제들 선택자(Next Siblings Selector) 예제입니다. 선택자(Selectors) 기본 선택자(Basic) 계층 선택자(Hierarchy) Descendant Selector 모든 자식을 선택합니다. Child Selector는 바로 하위 자식만 선택합니다.(parent > child) Next Adjacent Selector 다음 형제 태그를 선택합니다.(prev + next) Next Siblings Selector 다음 형제 모든 태그를 선택합니다.(p..
Definition 형제 선택자 다음 형제 태그를 선택합니다.(prev + next) Syntax $("div + ul").메서드; Compatibility 6 7 8 9 10 11 Next Adjacent Sample1 형제 선택자(Next Adjacent Selector) 예제입니다. 선택자(Selectors) 기본 선택자(Basic) 계층 선택자(Hierarchy) Descendant Selector 모든 자식을 선택합니다. Child Selector는 바로 하위 자식만 선택합니다.(parent > child) Next Adjacent Selector 다음 형제 태그를 선택합니다.(prev + next) Next Siblings Selector 다음 형제 모든 태그를 선택합니다.(prev ~ sib..
Definition 자식 선택자는 바로 하위 자식만 선택합니다.(parent > child) Syntax $("div > ul").메서드; Compatibility 6 7 8 9 10 11 Child Sample1 자식 선택자(Child Selector) 예제입니다. 선택자(Selectors) 기본 선택자(Basic) 계층 선택자(Hierarchy) Descendant Selector 모든 자식을 선택합니다. Child Selector는 바로 하위 자식만 선택합니다.(parent > child) Next Adjacent Selector 다음 형제 태그를 선택합니다.(prev + next) Next Siblings Selector 다음 형제 모든 태그를 선택합니다.(prev ~ siblings) 기본필터 ..
Definition 자손 선택자 모든 자식을 선택합니다. Syntax $("div ul").메서드; Compatibility 6 7 8 9 10 11 Descendant Sample1 자손 선택자(Descendant Selector) 예제입니다. 선택자(Selectors) 기본 선택자(Basic) 계층 선택자(Hierarchy) Descendant Selector 모든 자식을 선택합니다. Child Selector는 바로 하위 자식만 선택합니다.(parent > child) Next Adjacent Selector 다음 형제 태그를 선택합니다.(prev + next) Next Siblings Selector 다음 형제 모든 태그를 선택합니다.(prev ~ siblings) 기본필터 선택자(Basic Fi..
Definition 다중 셀렉터는 여러가지 태그를 선택합니다. Syntax $("element, element, ....").메서드; Compatibility 6 7 8 9 10 11 element Sample1 다중 Element 예제입니다. 선택자(Selectors) 전체 셀렉터는 전체 태그를 선택합니다. 클래스 셀렉터는 클래스 태그를 선택합니다. 아이디 셀렉터는 아이디 태그를 선택합니다. 태그 셀렉터는 기본 태그를 선택합니다. 다중 셀렉터는 여러가지 태그를 선택합니다. 기본 선택자입니다. 선택자(Selectors) 선택자입니다. $("#one1").addClass("on");//아이디 선택자 $(".one2").addClass("on");//클래스 선택자 $("*").addClass("on"); /..
Definition 태그 셀렉터는 기본 태그를 선택합니다. Syntax $("element").메서드; Compatibility 6 7 8 9 10 11 element Sample1 Element 예제입니다. 선택자(Selectors) 전체 셀렉터는 전체 태그를 선택합니다. 클래스 셀렉터는 클래스 태그를 선택합니다. 아이디 셀렉터는 아이디 태그를 선택합니다. 태그 셀렉터는 기본 태그를 선택합니다. 다중 셀렉터는 여러가지 태그를 선택합니다. 기본 선택자입니다. 선택자(Selectors) 선택자입니다. $("#one1").addClass("on");//아이디 선택자 $(".one2").addClass("on");//클래스 선택자 $("*").addClass("on"); // 전체 선택자 $("li").add..
Definition 아이디 셀렉터는 아이디 태그를 선택합니다. Syntax $("#id").메서드; Compatibility 6 7 8 9 10 11 #id Sample1 아이디 선택자 예제입니다. 선택자(Selectors) 전체 셀렉터는 전체 태그를 선택합니다. 클래스 셀렉터는 클래스 태그를 선택합니다. 아이디 셀렉터는 아이디 태그를 선택합니다. 태그 셀렉터는 기본 태그를 선택합니다. 다중 셀렉터는 여러가지 태그를 선택합니다. 기본 선택자입니다. 선택자(Selectors) 선택자입니다. $("#one1").addClass("on");//아이디 선택자 $(".one2").addClass("on");//클래스 선택자 $("*").addClass("on"); // 전체 선택자 $("li").addClass(..
Definition 클래스 셀렉터는 클래스 태그를 선택합니다. Syntax $(".class").메서드; Compatibility 6 7 8 9 10 11 .class Sample1 Selector .class 예제입니다. 선택자(Selectors) 전체 셀렉터는 전체 태그를 선택합니다. 클래스 셀렉터는 클래스 태그를 선택합니다. 아이디 셀렉터는 아이디 태그를 선택합니다. 태그 셀렉터는 기본 태그를 선택합니다. 다중 셀렉터는 여러가지 태그를 선택합니다. 기본 선택자입니다. 선택자(Selectors) 선택자입니다. $("#one1").addClass("on");//아이디 선택자 $(".one2").addClass("on");//클래스 선택자 $("*").addClass("on"); // 전체 선택자 $("..
Definition (*)전체 셀렉터는 전체 태그를 선택합니다. Syntax $("*").메서드; Compatibility 6 7 8 9 10 11 * Sample1 sample 예제입니다. 선택자(Selectors) 전체 셀렉터는 전체 태그를 선택합니다. 클래스 셀렉터는 클래스 태그를 선택합니다. 아이디 셀렉터는 아이디 태그를 선택합니다. 태그 셀렉터는 기본 태그를 선택합니다. 다중 셀렉터는 여러가지 태그를 선택합니다. 기본 선택자입니다. 선택자(Selectors) 선택자입니다. $("#one1").addClass("on");//아이디 선택자 $(".one2").addClass("on");//클래스 선택자 $("*").addClass("on"); // 전체 선택자 $("li").addClass("on"..
Definition .index() 메서드는 이벤트가 발생한 요소의 인덱스 값을 반환합니다 Syntax $(selector).index(); $(selector).index(selector); $(selector).index(element); Compatibility 6 7 8 9 10 11 .index() Sample1 index를 이용해 li를 선택하는 예제입니다. 필터링(Filtering) : 글을 클릭하여 인덱스를 확인합니다. .eq() : 인덱스 번호에 해당하는 요소를 찾습니다. .filter() : 선택된 요소 집합에서 선택자를 추가하거나 함수를 사용해서 원하는 결과를 추출해냅니다. .first() : 선택된 요소 집합에서 첫번째 자식 요소를 찾습니다. .has() : 선택된 요소들이 자신의 ..
.scrollTop() 메서드는 선택한 요소의 가로 스크롤 값을 설정하거나 반환합니다. Definition .scrollTop() 메서드는 선택한 요소의 세로 스크롤 값을 설정하거나 반환합니다. Syntax $(selector).scrollTop(); Compatibility 6 7 8 9 10 11 .scrollTop() Sample 선택한 요소의 속성 값을 가져옵니다. offset().left = 0px offset().top = 0px position().left = 0px position().top = 0px scrollLeft = 0px scrollTop = 0px Drag offset().left = 0px offset().top = 0px position().left = 0px positio..
.siblings() 메서드는 선택한 요소의 모든 형제 요소를 선택합니다. Definition .siblings() 메서드는 선택한 요소의 모든 형제 요소를 선택합니다. Syntax $("selector").siblings("selector"); Compatibility 6 7 8 9 10 11 .siblings() Sample1 .siblings() 메서드 예제입니다. 탐색(Traversing) 트리구조 탐색(Tree Traversal) .children() 메서드는 선택한 요소의 모든 자식을 선택합니다. .closest() 메서드는 선택한 요소의 상위 요소 중 가장 가까운 요소를 선택합니다. .find() 메서드는 선택한 요소에서 조건에 맞는 요소를 다시 선택합니다. .next() 메서드는 선택한 요..
.prevUntil() 메서드는 지정한 선택 요소의 이전 모든 요소를 선택합니다. Definition .prevUntil() 메서드는 지정한 선택 요소의 이전 모든 요소를 선택합니다. Syntax $("selector").prevUntil("selector"); Compatibility 6 7 8 9 10 11 .prevUntil() Sample1 .prevUntil() 메서드 예제입니다. 탐색(Traversing) 트리구조 탐색(Tree Traversal) .children() 메서드는 선택한 요소의 모든 자식을 선택합니다. .closest() 메서드는 선택한 요소의 상위 요소 중 가장 가까운 요소를 선택합니다. .find() 메서드는 선택한 요소에서 조건에 맞는 요소를 다시 선택합니다. .next()..
.prevAll() 메서드는 선택한 요소의 이전 모든 요소를 선택합니다. Definition .prevAll() 메서드는 선택한 요소의 이전 모든 요소를 선택합니다. Syntax $("selector").prevAll() $("selector").prevAll("selector") Compatibility 6 7 8 9 10 11 .prevAll() Sample1 .prevAll() 메서드 예제입니다. 탐색(Traversing) 트리구조 탐색(Tree Traversal) .children() 메서드는 선택한 요소의 모든 자식을 선택합니다. .closest() 메서드는 선택한 요소의 상위 요소 중 가장 가까운 요소를 선택합니다. .find() 메서드는 선택한 요소에서 조건에 맞는 요소를 다시 선택합니다. ..
.prev() 메서드는 선택한 요소의 이전 요소를 선택합니다. Definition .prev() 메서드는 선택한 요소의 이전 요소를 선택합니다. Syntax $("selector").prev() $("selector").prev("selector") Compatibility 6 7 8 9 10 11 .prev() Sample1 .prev() 메서드 예제입니다. 탐색(Traversing) 트리구조 탐색(Tree Traversal) .children() 메서드는 선택한 요소의 모든 자식을 선택합니다. .closest() 메서드는 선택한 요소의 상위 요소 중 가장 가까운 요소를 선택합니다. .find() 메서드는 선택한 요소에서 조건에 맞는 요소를 다시 선택합니다. .next() 메서드는 선택한 요소의 다음 ..
.parentsUntil() 메서드는 지정한 선택 요소의 모든 부모 요소를 선택합니다. Definition .parentsUntil() 메서드는 지정한 선택 요소의 모든 부모 요소를 선택합니다. Syntax $("selector").parentsUntil("selector"); Compatibility 6 7 8 9 10 11 .parentsUntil() Sample1 .parentsUntil() 메서드 예제입니다. 탐색(Traversing) 트리구조 탐색(Tree Traversal) .children() 메서드는 선택한 요소의 모든 자식을 선택합니다. .closest() 메서드는 선택한 요소의 상위 요소 중 가장 가까운 요소를 선택합니다. .find() 메서드는 선택한 요소에서 조건에 맞는 요소를 다시..
.parents() 메서드는 선택한 요소의 부모 요소를 선택합니다. Definition .parents() 메서드는 선택한 요소의 부모 요소를 선택합니다. Syntax $("selector").parents() $("selector").parents("selector") Compatibility 6 7 8 9 10 11 .parents() Sample1 .parents() 메서드 예제입니다. 탐색(Traversing) 트리구조 탐색(Tree Traversal) .children() 메서드는 선택한 요소의 모든 자식을 선택합니다. .closest() 메서드는 선택한 요소의 상위 요소 중 가장 가까운 요소를 선택합니다. .find() 메서드는 선택한 요소에서 조건에 맞는 요소를 다시 선택합니다. .next(..
.parent() 메서드는 선택한 요소의 부모 요소를 선택합니다. Definition .parent() 메서드는 선택한 요소의 부모 요소를 선택합니다. Syntax $("selector").parent() $("selector").parent("selector") Compatibility 6 7 8 9 10 11 .parent() Sample1 .parent() 메서드 예제입니다. 탐색(Traversing) 트리구조 탐색(Tree Traversal) .children() 메서드는 선택한 요소의 모든 자식을 선택합니다. .closest() 메서드는 선택한 요소의 상위 요소 중 가장 가까운 요소를 선택합니다. .find() 메서드는 선택한 요소에서 조건에 맞는 요소를 다시 선택합니다. .next() 메서드는..
.nextUntil() 메서드는 지정한 선택 요소의 모든 요소를 선택합니다. Definition .nextUntil() 메서드는 지정한 선택 요소의 모든 요소를 선택합니다. Syntax $("selector").nextUntil("selector"); Compatibility 6 7 8 9 10 11 .nextUntil() Sample1 .nextUntil() 메서드 예제입니다. 탐색(Traversing) 트리구조 탐색(Tree Traversal) .children() 메서드는 선택한 요소의 모든 자식을 선택합니다. .closest() 메서드는 선택한 요소의 상위 요소 중 가장 가까운 요소를 선택합니다. .find() 메서드는 선택한 요소에서 조건에 맞는 요소를 다시 선택합니다. .next() 메서드는 ..
.nextAll() 메서드는 선택한 요소의 다음 모든 요소를 선택합니다. Definition .nextAll() 메서드는 선택한 요소의 다음 모든 요소를 선택합니다. Syntax $("selector").nextAll() $("selector").nextAll("selector") Compatibility 6 7 8 9 10 11 .nextAll() Sample1 .nextAll() 메서드 예제입니다. 탐색(Traversing) 트리구조 탐색(Tree Traversal) .children() 메서드는 선택한 요소의 모든 자식을 선택합니다. .closest() 메서드는 선택한 요소의 상위 요소 중 가장 가까운 요소를 선택합니다. .find() 메서드는 선택한 요소에서 조건에 맞는 요소를 다시 선택합니다. ..
.next() 메서드는 선택한 요소의 다음 요소를 선택합니다. Definition .next() 메서드는 선택한 요소의 다음 요소를 선택합니다. Syntax $("selector").next(); $("selector").next("selector"); Compatibility 6 7 8 9 10 11 .next() Sample1 .next() 메서드 예제입니다. 탐색(Traversing) 트리구조 탐색(Tree Traversal) .children() 메서드는 선택한 요소의 모든 자식을 선택합니다. .closest() 메서드는 선택한 요소의 상위 요소 중 가장 가까운 요소를 선택합니다. .find() 메서드는 선택한 요소에서 조건에 맞는 요소를 다시 선택합니다. .next() 메서드는 선택한 요소의 다..
.find() 메서드는 선택한 요소에서 조건에 맞는 요소를 다시 선택합니다. Definition .find() 메서드는 선택한 요소에서 조건에 맞는 요소를 다시 선택합니다. Compare 선택한 요소 중 지정한 텍스트를 포함하는 요소를 선택할 때에는 .contains()를 사용합니다. 선택한 요소 중 지정한 태그를 포함하는 요소를 선택할 때에는 .has()를 사용합니다. 선택한 요소 중 지정한 요소만 제외하고 선택할 때에는 .not()를 사용합니다. 선택한 요소 중 지정한 요소를 다시 선택할 때에는 .find()를 사용합니다. 선택한 요소 중 가장 가까운 상위 요소를 선택할 때에는 .closest()를 사용합니다. Syntax $("selector").find("selector"); Compatibili..
.closest() 메서드는 선택한 요소의 상위 요소 중 가장 가까운 요소를 선택합니다. Definition .closest() 메서드는 선택한 요소의 상위 요소 중 가장 가까운 요소를 선택합니다. Compare 선택한 요소 중 지정한 텍스트를 포함하는 요소를 선택할 때에는 .contains()를 사용합니다. 선택한 요소 중 지정한 태그를 포함하는 요소를 선택할 때에는 .has()를 사용합니다. 선택한 요소 중 지정한 요소만 제외하고 선택할 때에는 .not()를 사용합니다. 선택한 요소 중 지정한 요소를 다시 선택할 때에는 .find()를 사용합니다. 선택한 요소 중 가장 가까운 상위 요소를 선택할 때에는 .closest()를 사용합니다. Syntax $("selector").closest("select..
.children() 메서드는 선택한 요소의 모든 자식을 선택합니다. Definition .children() 메서드는 선택한 요소의 모든 자식을 선택합니다. Syntax $("selector").children( ); $("selector").children( "selector" ); Compatibility 6 7 8 9 10 11 .children() Sample1 .children() 메서드 예제입니다. 탐색(Traversing) 트리구조 탐색(Tree Traversal) .children() 메서드는 선택한 요소의 모든 자식을 선택합니다. .closest() 메서드는 선택한 요소의 상위 요소 중 가장 가까운 요소를 선택합니다. .find() 메서드는 선택한 요소에서 조건에 맞는 요소를 다시 선택..
.end() 메서드는 필터링이 일어나기 이전의 요소를 선택합니다. Definition .end() 메서드는 필터링이 일어나기 이전의 요소를 선택합니다. Syntax $("selector").end() Compatibility 6 7 8 9 10 11 .end() Sample1 .end() 메서드 예제입니다. 탐색(Traversing) .add() 메서드는 선택한 요소에 새로운 요소를 추가하여 선택합니다. .addBack() 메서드는 선택한 요소의 상위 요소도 추가하여 선택합니다. .contents() 메서드는 선택한 요소와 일치하는 콘텐츠요소를 선택합니다. .each() 메서드는 선택한 여러 요소들을 각각 순차적으로 실행합니다. .end() 메서드는 필터링이 일어나기 이전의 요소를 선택합니다. 이것은 p..
.each() 메서드는 선택한 여러 요소들을 각각 순차적으로 실행합니다. Definition .each() 메서드는 선택한 여러 요소들을 각각 순차적으로 실행합니다. Syntax $("selector").each( function ) Compatibility 6 7 8 9 10 11 .each() Sample1 .each() 메서드 예제입니다. 탐색(Traversing) .add() 메서드는 선택한 요소에 새로운 요소를 추가하여 선택합니다. .addBack() 메서드는 선택한 요소의 상위 요소도 추가하여 선택합니다. .contents() 메서드는 선택한 요소와 일치하는 콘텐츠요소를 선택합니다. .each() 메서드는 선택한 여러 요소들을 각각 순차적으로 실행합니다. .end() 메서드는 필터링이 일어나기..
.contents() 메서드는 선택한 요소의 하위 콘텐츠를 선택합니다. Definition .contents() 메서드는 선택한 요소의 하위 콘텐츠를 선택합니다. Compare 선택한 요소에서 한 번 더 선택 할 때에는 .filter() 메서드를 사용합니다. 선택한 요소에서 하위 콘텐츠 중 가장 근접한 콘텐츠를 선택할 때에는 .contents() 메서드를 사용합니다. Syntax $("selector").contents() Compatibility 6 7 8 9 10 11 .contents() Sample1 .contents() 메서드 예제입니다. 탐색(Traversing) .add() 메서드는 선택한 요소에 새로운 요소를 추가하여 선택합니다. .addBack() 메서드는 선택한 요소의 상위 요소도 추가..
.addBack() 메서는 선택한 요소의 상위 요소도 같이 선택합니다. Definition .addBack() 메서는 선택한 요소의 상위 요소도 같이 선택합니다. Syntax $("selector").addBack("selector") Compatibility 6 7 8 9 10 11 .addBack() Sample1 .addBack() 메서드 예제입니다. 탐색(Traversing) .add() 메서드는 선택한 요소에 새로운 요소를 추가하여 선택합니다. .addBack() 메서드는 선택한 요소의 상위 요소도 추가하여 선택합니다. .contents() 메서드는 선택한 요소와 일치하는 콘텐츠요소를 선택합니다. .each() 메서드는 선택한 여러 요소들을 각각 순차적으로 실행합니다. .end() 메서드는 필터..