728x90 반응형 프로그래밍/jQuery13 [jquery] 제이쿼리를 사용하여 id 값 가져오기 제이쿼리 id로 값 가져오기ID는 고유한 값을 가지기 때문에 선택자가 정확합니다. 사용 예제 Get Value$('#myInput'): id="myInput"인 요소 선택..val(): 입력 필드의 값을 가져오거나 설정. 2024. 12. 8. [jquery] 동적 요소 이벤트 바인딩 처리 목 차1. $(document).on()2. 문법3. 사용 예제3-1. 기본 이벤트 바인딩3-2. 이벤트 위임3-3. 여러 이벤트 바인딩3-4. 이벤트 핸들러에 데이터 전달3-5. 추가된 동적 리스트에 이벤트 바인딩3-6. 이벤트 해제3-7. 특정 요소에 이벤트 제한3-8. 이벤트 버블링 막기4. on() 과 기존 메서드 비교 1. $(document).on()$(document).on() 메서드는 jQuery에서 이벤트 핸들러를 동적으로 등록하거나 위임할 때 사용되는 강력한 메서드입니다.on() 메서드는 특정 이벤트가 발생했을 때 실행할 함수를 지정합니다.이벤트를 직접 요소에 바인딩하거나, 이벤트 위임을 사용하여 동적으로 생성된 요소에도 이벤트를 적용할 수 있습니다.기존의 bind(), delegate.. 2024. 12. 2. [jquery] click() 메서드와 on("click") 메서드의 차이 목 차1. click() VS on.("click") 비교2. 비교 예제2-1. 정적 요소에 이벤트 바인딩2-2. 동적 요소에 이벤트 바인딩2-3. 다중 이벤트 처리3. 정리 1. click() VS on.("click") 비교특징click()on("click")동적 요소 지원지원하지 않음지원 (이벤트 위임 사용 시 가능)이벤트 위임불가능가능 (부모 요소에 이벤트 바인딩)다중 이벤트 등록단일 이벤트만 처리 가능여러 이벤트 유형 등록 가능사용법 간결성더 간단한 방식상대적으로 복잡권장 여부간단한 경우 사용 가능대부분의 경우 권장 2. 비교 예제2-1. 정적 요소에 이벤트 바인딩// click() 사용$("button").click(function() { alert("Button clicked!");}.. 2024. 12. 2. jQuery 페이지 로드 후 실행 이벤트 목 차1. $(document).ready()2. 주요 개념2-1. DOM이 로드 되었을 때 실행2-2. HTML 문서와 외부 리소스 로드의 차이3. 문법4. 사용 예제4-1. 기본 사용4-2. 축약형 사용4-3. 이벤트 핸들러 등록5. 여러 개의 ready() 호출6. $(document).ready()와 window.onload의 비교7. 정리 1. $(document).ready()$(document).ready()는 jQuery에서 DOM(Document Object Model)이 완전히 로드되고 파싱된 후에 실행되는 코드를 정의하는 메서드입니다.이 메서드는 HTML 문서가 완전히 로드된 뒤에 JavaScript 코드를 실행할 수 있도록 보장하며, 특히 문서 로드 시점의 이벤트 처리에 유용합니다... 2024. 12. 2. 제이쿼리 선택자 정리 (Selector) 목 차1. 전체 선택자 (*)2. 태그 선택자3. 아이디 선택자 (#id)4. 클래스 선택자 (.class)5. 속성 선택자6. 그룹 선택자7. 후손 선택자8. 자식 선택자 (>)9. 형제 선택자 (+, ~)10. Pseudo-class 선택자 1. 전체 선택자 (*)설명: 문서의 모든 요소를 선택합니다.$("*").css("color", "red"); // 모든 요소의 텍스트를 빨간색으로 변경 2. 태그 선택자 설명: 특정 태그 이름을 기준으로 요소를 선택합니다.$("p").hide(); // 모든 태그를 숨김 3. 아이디 선택자 (#id) 설명: 특정 id 값을 가진 요소를 선택합니다.$("#header").text("Hello!"); // id가 'header'인 요소의 텍스트를 변경 4. 클.. 2024. 12. 1. CDN 사용하여 jQuery 프로젝트 설치하기 목 차1. CDN이란?2. jQuery CDN 확인하기2-1. 현재 압축된 안정 버전 (minified)2-2. 압축되지 않은 안정 버전 (디버깅용)3. 프로젝트 jQuery 설치 1. CDN이란?CDN(Content Delivery Network)은 전 세계에 분산된 서버 네트워크를 통해 라이브러리를 빠르게 제공하는 시스템입니다.브라우저가 동일한 jQuery 파일을 이미 캐시하고 있을 가능성이 커서 로드 속도가 빨라짐.서버 부하를 줄일 수 있음. 2. jQuery CDN 확인하기 jQuery CDN 주소는 jQuery 공식 웹사이트에서 항상 최신 버전을 확인할 수 있습니다. 2-1. 현재 압축된 안정 버전 (minified) 2-2. 압축되지 않은 안정 버전 (디버깅용) 3. 프로젝트 jQuery .. 2024. 11. 30. 이전 1 2 3 다음 728x90 반응형