본문 바로가기

👩🏻‍💻STUDY

(78)

[jQuery] 필터링메소드 first() last() eq() filter() not() has() is() map() slice() [jQuery] 필터링메소드 필터링 메소드 .first() .last() .eq() .filter() .not() .has() .is() .map() .slice() 출처 :: 필터링 메소드 .first() .last() .eq() .filter() .not() .is() 필터링(filtering)메소드 DOM트리에서 선택한 요소를 필터링하기 위한 메소드는 다음과 같다. 메소드 설명 .first() 선택한 요소 중에서 첫 번째 요소를 선택함. .last() 선택한 요소 중에서 마지막 요소를 선택함. .eq() 선택한 요소 중에서 전달받은 인덱스에 해당하는 요소를 선택함. .filter() 선택한 요소 중에서 전달받은 선택자에 해당하거나, 함수 호출의 결과가 참(true)인 요소를 모두 선택_함. .not..

[jQuery] on() off() one() [jQuery] 이벤트 연결 및 처리 on(), off(), one() 출처 1. 이벤트의 연결(event binding) 특정 요소에서 발생하는 이벤트를 처리하기 위해서는 이벤트 핸들러(event handler)함수를 작성해야 한다. 이렇게 작성된 이벤트 핸들러를 특정 요소에 연결하는 것을 이벤트바인딩(event binding)이라고 한다. jQuery는 이벤트바인딩을 위한 다양한 방법을 제공한다. [예제] :: id가 "btn"인 요소에 클릭(click) 이벤트 핸들러를 바인딩하는 다양한 방법이다. $('#btn').click(function(event) { /* 실행하고자 하는 jQuery 코드 */ }); $('#btn').bind('click', function(event) { /* 실행하고자 ..

[CSS] transition, transition-delay, transform, calc vendor prefix [CSS] transition, transition-delay, transform, calc vendor prefix #1. transition / transition-delay vendor prefix transition 은 IE10부터 지원한다. vendor prefixes -webkit-transition : [transition-property] [transition-duration] [transition-timing-function] [transition-delay]; -moz-transition : [transition-property] [transition-duration] [transition-timing-function] [transition-delay]; -o-transition : [..

[jQuery] queue() & dequeue() [jQuery] queue() & dequeue() 1. queue(), 대기열의 함수와 대기열 조작하기 출처 queue([queueName]) Return : Array 요소에 실행되고 있는 함수의 큐를 보여준다. queueName :: 큐명 문자열, 기본값은 fx이며, 기본 효과 큐를 의미한다. 무슨 함수들이 실행되고 있는지 보여준다. The queue is length is: 에는 div가 움직이는 갯수를 보여준다. ('span').text(n)만 하면 runIt()에서 움직이는 queue를 볼 수 있다. $div.slideUp('normal' , runIt)은 계속 반복하도록 도와준다. queue([queueName], newQueue) Return : jQuery 요소에 실행되고 있는 함수 큐를..

[jQuery] ready() load() 차이 [jQuery] .ready() .load() 차이 1. load() 서버에서 데이터를 가져오는 가장 간단한 방법. JavaScript이벤트를 "로드"하기 위해 이벤트 핸들러를 바인드 한다. 서버에서 데이터를 로드하고 리턴된 HTML에서 일치하는 요소를 배치한다. .load( url [,data][, complete]) , 반환값 : jQuery url :: 데이터를 받을 URL을 나타내는 문자열. data :: 선택적인 인자, URL로 요청보낼 때 같이 보낼 데이터로 자바스크립트 객체 또는 문자열. complete :: 요청이 완료되면 호출되어질 콜백함수. $('#result').load('ajax/test.html #container'); 이 메소드가 실행되면 ajax/test.html 컨텐츠를 검색..

[jQuery] stop() & clearQueue() & delay() [jQuery] stop() & clearQueue() & delay() animate stop() & Queue() & delay() [출처]https://webclub.tistory.com/461 1. 애니메이션 큐 큐는 특정한 앨리먼트에서 발생될 애니메이션 목록이다. 제이쿼리를 사용해 엘리먼트에서 애니메이션을 실행시킬 때마다 애니메이션 큐에 저장된다. 엘리먼트는 큐의 모든 애니메이션이 완료될 때까지 큐에 저장된 애니메이션을 한번에 하나씩 실행시킨다. 큐는 먼저 들어간 것이 먼저 나오는 공간을 말한다. jQuery의 효과 메서드를 사용하면 효과 명령이 차례대로 큐에들어가고, 들어간 순서대로 실행된다. $('.queue-box').on('click', function(){ $(this) .aniamte..

이전 1 ··· 7 8 9 10 다음

티스토리툴바