이벤트 처리기 매핑 (event handler mapping) 이벤트가 발생하는 경우 특정 로직을 수행하기 위해 이벤트와 메서드를 연결 window.onload = pageLoad; 이벤트 :load 이벤트 처리기 : pageLoad 이 둘을 연결하기 위한 코드 : 매핑코드 이벤트 객체 자바스크립트 브라우저마다 이벤트 객체 사용방법이 다르다 브라우저마다 이벤트 객체 속성이 다르다 JQuery 모든 브라우저가 같은 방법으로 사용, 같은 속성을 가진다 속성 event.pageX : 브라우저 화면 기준 마우스 x좌표 event.pageY : 브라우저 화면 기준 마우스 y좌표 event.preventDefalut() : 기본이벤트 제거 event.stopPropagation() : 이벤트 전달 제거 1. jQu..

개체에 접근할 때, 선택자 혹은 필터로 이루어지지만 추가적인 필터링이나 추가적인 탐색이 필요할 경우 사용 1. 추가 필터링 관련 메서드 셀렉터를 통해 1차적으로 일치되는 집합을 얻어낸 후, 그 집합에 대해 사용할 수 있는 메서드 fileter(), is(), not() 2차적으로 추가 필터링을 하거나, 특정 요소가 어떤 조건에 부합하는지 검사할 때 사용 eq(index) :eq와 동일 ("div:eq(1)") = 현재 문서에 있는 div 중 2번째로 등장하는 div 개체를 얻는다 현재 문서 집합에서 탐색 ("div").eq(1) = 현재 문서의 div를 셀렉트, 메모리에 올린 후 그 중 2번째로 등장하는 개체를 얻는다 div 집합에서 탐색 결과는 동일하지만, eq메서드는 end()메서드를 사용하여, 이전..

CSS 관련 메서드 토글 removeClass Attribute 관련 메서드 네이버

조작 관련 메서드 요소의 내용을 조작하는 메서드 요소를 추가하는 메서드 요소를 래핑하거나 바꿔치기하는 메서드 요소를 제거하거나 복사하는 메서드 1. 요소의 내용을 조작하는 메서드 text() 해당 개체가 가지고있는 컨텐츠를 html 요소를 포함하지 않는 텍스트로 반환 여러 개체를 선택할 경우, 모든 대상의 텍스트를 결합해 반환 html() 개체가 포함하고 있는 html 컨텐츠를 반환 여러 개체를 선택할 경우, 첫 번째 요소의 html만을 반환 test중 span 태그입니다 제목1 제목2 제목3 2. 요소를 추가하는 메서드 append() : 내부 뒤쪽 prepend() : 내부 앞쪽 after() : 외부 뒤쪽 brfoer() : 외부 앞쪽 $('요소') before prepend 요소 a..

val() click() on() next() text() html() each() 1. val() val() 요소의 value 속성 값을 문자열로 리턴 input type = "text" value = "hi $("input").val() => hi val(값) 요소에 입력값으로 받은 값을 적용 $("#tx1").val("hello"); document.getElementById("tx1").value = "hello"; 2. on(), click() on() 이벤트 연결 작업 $("#btn").on("click",function); jquery는 자주 사용하는 이벤트에 대해 단축메서드 지정 click() $("#btn").click(function); 3. next(), text(), html() n..

$(selector) 또는 jQuery(selector) 각각의 표현식은 각 DOM요소의 확장 개체인 jQuery 개체 집합을 반환 일반 DOM개체를 jQuery 개체집합으로 반환하여, jQuery개체가 지원하는 메서드 적용 가능 body태그 내의 모든 DOM 요소에 접근 가능 $("selector") selector로 읽어오는 개체의 반환값은 jquery에서 사용할 수 있는 개체 CSS선택자를 그대로 사용 1. 기본 선택자 $('*') : 전체 선택자 $('#id') : id 선택자 $('.className') : 클래스 선택자 $('tagName') : 태그 선택자 h1태그 h2 태그1 h2태그 2 div 태그 문단1 문단2 안녕 2. 자식선택..