Category: jQuery

2018
0
정리jQuery

jQuery append, prepend, after, before 차이

jQuery에서 DOM을 제어할 때 요소 앞에 넣느냐 뒤에 넣느냐의 메서드는 append() 또는 prepend(), after(), before() 를 많이 사용한다. 그런데 이 차이점이 각자 조금씩 다른데 stackoverflow 에서 단 하나의 이미지를 통해서 이해하기 쉽게 올려줘서 그것을 올려본다. .append(), prepend(), .after

0
정리jQuery

jQuery API event.target

event.target 속성이벤트를 시작한 DOM 요소 리턴 값은 요소를 리턴한다. target 속성은 이벤트 또는 해당 이벤트의 자손에 대해 등록 된 요소가 될 수 있습니다. 이벤트 버블링으로 인해 이벤트가 처리되고 있는지 판별하기 위해 event.target을 this와 비교하는 것이 종종 유용합니다. 이 속성은 이벤트 위임에 매우 유용합니다.

0
정리jQuery

jQuery API event.data 메서드

event.data예제도 좀 어렵고 이해가 안된다. 그런데 여기 jQuery tutorial Youtube 보고 좀 이해 됬음 youtube jquery tutorial W3SCHOOL 예제 설명 12345678910111213141516171819202122232425262728293031323334<!doctype html><html l

0
정리jQuery

jQuery API toggleClass 메서드

toggleClass() 메서드는 하나 이상의 클래스 이름을 매개변수로 사용합니다. 첫번째 버전에서는 일치하는 요소 안에 class 속성이 이미 존재할 때는 그 class 명을 지웠다. 반대로 인자로 주어진 클래스 속성이 없으면 추가된다.

0
정리jQuery

jQuery API toArray 메서드

toArray() 메서드jQuery 집합에 포함된 모든 요소를 배열로 반환 toArray() 메서드는 jQuery 선택자의 모든 jQuery 집합을 배열로 반환한다. 1alert( $( "li" ).toArray() ); 일치하는 모든 DOM 노드는 표준 배열에 포함 된 형태로 반환됩니다.

0
정리jQuery

jQuery 속성 선택자 정리

jQuery 속성 선택자 정리jQuery는 CSS의 선택자(Selector) 방식을 사용해서 DOM에 접근한다. 선택자에는 여러 종류가 있는데, 자주 사용하는 선택자로는 id 선택자, class선택자, tag선택자 등이 있는데 아래 살펴볼 속성 선택자는 클래스 속성이나 id 속성과 같이 대표적인 속성이 아닌 태그 안의 특정 속성들에 따라 스타일을 지정한다.

0
정리jQuery

jQuery API get 메서드

get() 메서드jQuery 객체와 일치하는 DOM 요소를 가져온다. get() 메서드는 각 jQuery 객체의 기본 DOM 노드에 대한 액세스를 허용한다. index의 값이 범위를 벗어나는 경우 undefined 값을 반환한다. 아래의 코드를 통해서 확인해보자

0
정리jQuery

jQuery API find 메서드

find() 메서드선택자, jQuery 객체 요소를 찾아서 일치하는 요소의 하위 요소를 찾는 메서드 즉 인자로 넘어간 선택자의 하위 요소를 찾아준다. find()와 children() 의 차이점은 find()는 DOM 레벨 트리에서 요소의 모든 자식 요소를 검색하고 children()은 DOM 레벨 트리에서 바로 아래 단계 자식 요소만을 추출하는 점에서 차이가 있다. 예제를 보자

0
정리jQuery

jQuery API data 메서드

data() 메서드일치된 요소와 임의의 data를 저장하거나 data의 key값으로 지정한 값을 가져올 수 있다. data() 메서드를 사용하면 모든 유형의 데이터를 DOM 요소에 추가할 수 있다. 12345$( "body" ).data( "foo", 52 );$( "body" ).data( "bar", { myType: "test", count: 40 } );$( "body" ).data( { baz: [ 1, 2, 3 ] } );$( "body" ).data( "foo" ); // 52$( "body" ).data(); // { foo: 52, bar: { myType: "test", count: 40 }, baz: [ 1, 2, 3 ] }