목록웹 프로그래밍/jQuery (6)
yongyong-e
1) click 이벤트 jQuery에서는 기본적으로 click 함수를 사용하여 클릭 이벤트를 발생시킵니다. 이벤트를 발생시킨 객체를 찾을때는 (event.currentTarget 및 this 키워드)를 사용할 수 있습니다. 이벤트를 연결할 때 이벤트 객체의 data 속성을 사용하여 다양하게 클릭 이벤트를 식별할 수 있습니다. Hello World 2) on 형태의 이벤트 Hello World 3) 마우스 이벤트 정리 click 노드를 마우스 포인터로 눌렀다가 떼었을 때에 발생 dblclick 노드를 더블 클릭 했을 때에 발생 hover mouseenter와 mouseleave 이벤트를 한번에 bind mousedown 영역에 마우스를 눌렀다가 떼었을 때에 발생 mouseenter 노드에 마우스가 진입했을..
0) 개요 jQuery에서 문서 객체를 삽입 및 이동하는 방법 1) 문서 객체 삽입 방법 1.이 메서드 체이닝을 사용하기 더 쉽다고 생각하기에 방법 2. 보다 방법 1.을 선호 Hello 결과 또한 페이지 검사를 통해 코드 내부를 보게 되면 아래 처럼 태그들이 적용된 것을 확인할 수 있습니다. 2) 문서 객체 이동 Hello Hello Hello h1 태그 이동 전 h1 태그 이동 후 또한 페이지 검사를 통해 코드 내부를 보게 되면 아래 처럼 h1 태그가 이동된 것을 확인할 수 있습니다.
0) 개요 jQuery에서 클래스 속성에 대해 추가 및 제거하는 방법 1) 문서 객체의 클래스 속성 추가 1. attr 함수를 통해 class 속성을 지정하여 스타일을 적용하는 방법 Hello World 2. addClass 함수를 통해 스타일을 적용하는 방법 Hello World 2) 문서 객체의 클래스 속성 제거 다음 코드는 "Hello World"라는 문장을 center 및 red 스타일 클래스를 적용하고 2초 후에 지정한 클래스를 제거하는 코드입니다. Hello World 결과 2초 후
0) 개요 jQuery의 css, attr, html, text 함수에 대한 정리 1) css 함수 1. (문자열, 문자열) 형태 Hello World 추가적으로 아래 처럼 함수를 사용하여 태그를 리스트로 가져와 사용할 수도 있습니다. Hello World Hello World Hello World 2. (객체) 형태 Hello World 추가적으로 아래 처럼 함수를 사용하여 태그를 리스트로 가져와 사용할 수도 있습니다. Hello World Hello World Hello World 2) attr 함수 3) html 함수 결과 4) text 함수 결과
1) jQuery 라이브러리 다운로드 jQuery는 https://jquery.com를 통해 아래와 같이 다운로드를 받을수 있으며, compressed, production 버전과 uncompressed, development 버전을 다운로드 받을수 있습니다. 2) compressed, production vs. uncompressed, development compressed, production 버전 : 아래와 같이 소스코드를 압축하여 용량을 최소한 것으로 개발이 끝난 후에 사용자에게 조금 더 빠른 웹페이지를 제공하기 위해 사용하는 버전입니다. uncompressed, development 버전 : 아래와 같이 압축되지 않은 원래의 소스코드를 제공해주는 버전입니다. 3) jQuery 라이브러리 사용 ..