jQuery learning_jquery 기본 지식 요약

jQuery 학습 노트:

jQuery 학습
1. 기본 구문:
$(selector).action()
$: jQuery 정의
selector: 선택기, 쿼리 및 HTML 요소 찾기
action(): 요소에 수행되는 작업
예:
$(this).hide()------현재 요소 숨기기
$("p"),hide( )---------모든 p 요소 숨기기
$("#ID").hide()------id=ID인 요소 숨기기
$("p.Class")- - ------class=Class로 P 숨기기

$(document).ready(function(){------})
이는 이전에 문서가 실행되지 않도록 하는 데 사용됩니다. jQuery 코드가 로드되었습니다.
2. 선택기는 속성을 통해 요소를 선택합니다.
$("[href]") href 속성이 있는 모든 요소를 ​​선택합니다.
$("[href='AA']") href='AA ' 속성을 선택합니다.
$("[href!='AA']") 요소는 모든 href를 선택합니다! ='AA' 요소
$("[href$='.jpg']")는 href 값이 .jpg로 끝나는 모든 요소를 ​​선택합니다
3. 선택기는 CSS 속성을 선택합니다
$("p "). .css("Background-color","red"); 모든 p 요소의 배경색을 빨간색으로 수정합니다.
$("div#ID .Class") id=ID인 div 요소의 All class=Class 요소
4. 이름 충돌
$ 대신 var jQMy = jQuery.noConstrict() yong jQMy
5. 공통 이벤트
$(document).ready(function) 문서의 준비 이벤트
$(selector ).click(function) 선택된 요소의 클릭 이벤트
$(selector).dblclick(function) 선택된 요소의 더블 클릭 이벤트
$(selector).focus(function) 선택된 요소는 focus 이벤트
$(selector).mouseover(function) 선택한 요소 마우스오버 이벤트
6. jQuery 효과
$(selector).hide() 선택한 요소 숨기기
$(selector). 선택한 요소 표시
$(selector).toggle() 선택한 요소 숨기기 및 표시 전환
$(selector).slideDown() 선택한 요소 아래로 슬라이드(표시)
$(selector ).slideUp() 선택한 요소를 위로 슬라이드(숨기기)
$(selector).slideToggle() 선택한 요소를 위로 슬라이드와 아래로 슬라이드로 전환
$(selector).fadeIn () 선택한 요소를 페이드
$(selector).fadeOut() 선택한 요소를 페이드 아웃
$(selector).fadeTo() 선택한 요소를 지정된 불투명도로 페이드
$(selector) .animate()는 사용자 정의 애니메이션을 수행합니다. 선택한 요소
매개변수: "slow", "fast", "normal" 또는 밀리초
콜백 함수: callback
$("p").hide(1000 ,function(){
alert ("이제 단락이 숨겨졌습니다.");
})
7. jQuery의 HTML 작업
$(selector).html(content) 선택한 요소의 (내부) HTML
$(selector).append(content) 선택한 요소의 (내부) HTML에 콘텐츠 추가 콘텐츠 앞에 추가
$(selector).after(content) 선택한 요소 뒤에 HTML 추가
$(selector) .before(content) 선택한 요소 앞에 HTML 추가
8. jQuery의 CSS 작업
$(selector).css(name,value) 일치하는 요소에 대한 스타일 속성 값 설정
$(selector ).css({properties}) 일치하는 요소에 대해 여러 스타일 속성 설정
$(selector).css(name) 첫 번째로 일치하는 요소의 스타일 속성 값 가져오기
$(selector).height(value) 일치하는 요소의 높이 설정
$(selector).width(value) 요소의 너비 일치 설정
9. jQuery AJAX 요청
$(selector).load(url,data,callback) 선택한 요소에 원격 데이터 로드
$.ajax(options) 원격 데이터 로드 XMLHttpRequest 객체에 로드
$.get(url,data,callback,type) HTTP GET을 사용하여 원격 데이터 로드
$. post(url,data,callback,type) HTTP POST를 사용하여 원격 데이터 로드
$.getJSON(url,data,callback) HTTP GET을 사용하여 원격 JSON 데이터 로드
$.getScript(url,callback) 로드 원격 JavaScript 파일 실행
(selector) jQuery 요소 선택기 구문
(url) 로드되는 데이터의 URL(주소)
(data) 서버로 전송되는 데이터의 키/값 개체
(콜백) 데이터가 로드되면 함수가 실행됩니다.
( type) 반환되는 데이터 유형(html, xml, json, jasonp, script, text)
(옵션) 모든 키/값 쌍 완전한 AJAX 요청을 위한 옵션