jQuery 이벤트 처리 및 DOM 조작 방법
이벤트 처리 기법
jQuery를 활용한 이벤트 바인딩과 엘리먼트 선택 방법을 설명합니다.
<!DOCTYPE html>
<html>
<head>
<title>jQuery 이벤트 예제</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<style>
.menu-container { width: 400px; margin-bottom: 20px; }
.menu-i ...
6월 8일 00:21에 게시됨
jQuery를 활용한 이미지 회전 애니메이션 기법
현대 웹 개발에서 단순한 '이미지 90도 회전'은 단순한 동작을 넘어서 DOM 조작, 렌더링 메커니즘, 애니메이션 스케줄링, 브라우저 성능 최적화 등 다양한 기술의 융합을 요구한다. 특히 널리 사용되는 jQuery를 활용할 때는 간결한 문법의 장점을 살리되, 고성능 애니메이션 처리에 대한 내재적 한계를 인식하고 대응해야 한다.
선택자 설계: 기능보다는 구조적 사고
기 ...
6월 2일 22:31에 게시됨
jqGrid에서 서브그리드 구현 방법
서브그리드 이벤트 핸들링
jqGrid의 서브그리드 기능 구현 시 주요 이벤트:
subGridRowExpanded: '+' 아이콘 클릭 시 발동. 자동 생성된 div 엘리먼트의 ID와 행 ID 획득 가능
subGridRowColapsed: '-' 아이콘 클릭 시 발동. 서브그리드 div 자동 제거
사용자 정의 동작 구현 가능 (예: 서브그리드 대체 기능)
기본 그리드 설정
<div class="container">
<ta ...
5월 28일 17:33에 게시됨
jQuery를 활용한 요소 선택 및 조작 기법
요소 선택과 조작의 핵심 기술
다운로드 가능한 예제 파일 chapter2/lab.selectors.html을 통해 다양한 jQuery 선택자 표현식을 테스트할 수 있습니다.
컨텍스트 제어
$() 메서드는 두 번째 인수로 컨텍스트를 지정할 수 있습니다. 이는 선택 범위를 특정 DOM 영역으로 제한하는 데 유용합니다.
$('.wrappedElement', '#sampleDOM').removeClass('wrappedElement');
이 문 ...
5월 23일 21:06에 게시됨