JS 프레임워크16 [jQuery] 효과 이름 설명 show( ) 문서 객체를 크게 확대하며 보여준다 hide( ) 문서 객체를 작게 축소하며 사라지게 한다 toggle( ) show( ) 메서드와 hide( ) 메서드를 번갈아 실행한다 slideDown( ) 문서 객체를 슬라이드 효과와 함께 보여준다 slideUp( ) 문서 객체를 슬라이드 효과와 함께 사라지게 한다 slideToggle( ) slideDown( ) 메서드와 slideUp( ) 메서드를 번갈아 실행한다 fadeIn( ) 문서 객체를 선명하게 보여준다 fadeOut( ) 문서 객체를 흐리게 사라지게 한다 fadeToggle( ) fadeIn( ) 메서드와 fadeOut( ) 메서드를 번갈아 실행한다 $(selector).method( ); $(selector).method(sp.. 2021. 4. 14. [jQuery] 이벤트 이벤트 연결 기본 이름 설명 on() 이벤트를 연결 메서드 두가지 형태 $(selector).on(evnetName, function(event){}) $(selector).on(object) 예제1 Header-0 Header-1 Header-2 결과 on메서드의 첫번째 매개변수에 이벤트 이름을 입력하고 두 번째 매개변수에 이벤트 리스너를 입력 예제2 Header-0 Header-1 Header-2 mouseenter : function (){ $(this).addClass('reverse'); }, mouseleave : function (){ $(this).removeClass('reverse');} reverse 클래스 속성을 추가하고, 마우스가 빠져나가면 reverse 클래스 속성을 제거 이벤트.. 2021. 4. 13. [jQuery] 문서 객체 문서 객체의 클래스 속성 추가 메소드 이름 설명 addClass() 문서 객체의 클래스 속성을 추가 합니다. Header-0 Header-1 Header-2 문서 객체의 클래스 속성 제거 메서드 이름 설명 removeClass() 문서 객체의 클래스 속성을 제거 Header-0 Header-1 Header-2 문서 객체의 속성 검사 메서드 이름 설명 attr() 속성과 관련된 모든 기능을 수행 문서 객체의 속성 추가 attr()메서드 사용 방법 1. $(selector).attr(name, value); 2. $(selector).attr(name, function (index,attr) {}); 3. $(selector).attr(object); 문서 객체의 속성 제거 이름 설명 removeAttr(n.. 2021. 4. 10. [jQuery] 문서 객체 선택과 탐색 기본 필터 메서드 filter 메서드 메서드 이름 설명 filter() 문서 객체를 필터링 한다. 1번 코드 Header-0 Header-1 Header-2 Header-3 Header-4 Header-5 매개 변수 설명 :even 짝수번째 요소를 모두 가져온다 ( first index : 0 ) :odd 홀수번째 요소를 모두 가져온다 ( first index : 0 ) filter() 메서드의 매개변수에 선택자를 입력 2번 코드 Header-0 Header-1 Header-2 Header-3 Header-4 Header-5 특정 위치의 문서 객체 선택 메서드 이름 설명 eq() 특정 위치에 존재하는 문서 객체를 선택 first() 첫 번째에 위치하는 문서 객체를 선택 last() 마지막에 위치하는 문서.. 2021. 4. 10. 이전 1 2 3 4 다음