jquery 입문 에 필요 한 기본 인식 및 실례(정리)

1.Juqery 는 javascript 의 우수한 프레임 워 크 입 니 다.이것 은 가 벼 운 js 라 이브 러 리 로 CSS 3 를 호 환 하고 각종 브 라 우 저(IE 6.0+,FF 1.5+,Safari 2.0+,Opera 9.0+)를 호 환 하 며 jQuery 2.0 및 후속 버 전 은 IE6/7/8 브 라 우 저 를 지원 하지 않 습 니 다.jQuery 는 사용자 로 하여 금 HTML documents,events 를 더욱 편리 하 게 처리 하고 애니메이션 효 과 를 실현 하 며 사이트 에 AJAX 상호작용 을 편리 하 게 제공 할 수 있 게 한다.jQuery 는 문서 설명 이 완전 하고 각종 응용 도 상세 하 며 성숙 한 플러그 인 도 많이 선택 할 수 있다 는 장점 도 있다.jQuery 는 사용자 의 html 페이지 를 코드 와 html 내용 을 분리 시 킬 수 있 습 니 다.즉,html 에 js 를 더 이상 삽입 하지 않 고 명령 을 호출 할 수 있 습 니 다.id 만 정의 하면 됩 니 다.jQuery 2.0 프레임 워 크 를 사용 할 때 위 에서 말 하고 싶 은 것 은 일부 코드 가 eclipse 에서 실행 되 지 않 으 면 브 라 우 저 커 널 이 너무 낮 고 높 은 버 전의 브 라 우 저 아래 에 만 효 과 를 표시 할 수 있다 는 것 을 설명 합 니 다.2.jQuery 라 이브 러 리 는 다음 과 같은 기능 을 포함 합 니 다./HTML 요소 선택/HTML 요소 조작/CSS 조작/HTML 이벤트 함수/JavaScript 효과 와 애니메이션/HTML DOM 옮 겨 다 니 기 및 수정/AJAX/Utilities 3.Google 과 Microsoft 는 jQuery 에 대한 지원 이 좋 습 니 다.jQuery 라 이브 러 리 를 컴퓨터 에 저장 하지 않 으 려 면 Google 이나 Microsoft 에서 CDN jQuery 핵심 파일 을 불 러 올 수 있 습 니 다.Google CDN 사용
 
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs
/jquery/1.4.0/jquery.min.js"></script>
</head>
Microsoft CDN 사용
 
<head>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery
/jquery-1.4.min.js"></script>
</head>
기본 문법:jQuery 문법 인 스 턴 스$(this).hide()는 jQuery hide()함 수 를 보 여 주 며 현재 HTML 요 소 를 숨 깁 니 다.$("\#")test").hide()/읽 기 id 프레젠테이션 jQuery hide()함수,id="test"요 소 를 숨 깁 니 다.$(")p").hide()는 jQuery hide()함 수 를 보 여 줍 니 다.모든

요 소 를 숨 깁 니 다.//이렇게 하면 탭$(".test")를 직접 읽 을 수 있 습 니 다.hide()는 jQuery hide()함 수 를 보 여 줍 니 다.모든 class="test"요 소 를 숨 길 수 있 습 니 다.//class 의 요소 노드 Jquery 를 읽 는 선택 기 는 여러 가지 가 있 습 니 다.jQuery 요소 선택 기 jQuery 는 CSS 선택 기 를 사용 하여 HTML 요 소 를 선택 합 니 다.$(")p")

요 소 를 선택 하 십시오.$(")p.intro")모든 class="intro"의

요 소 를 선택 하 십시오.$(")p\#demo")모든 id="demo"의

요 소 를 선택 하 십시오.jQuery 속성 선택 기 jQuery 는 XPath 표현 식 을 사용 하여 주어진 속성 을 가 진 요 소 를 선택 합 니 다.$("[href]")href 속성 이 있 는 모든 요 소 를 선택 하 십시오.$("[href='\#']")href 값 이'\#'와 같은 모든 요 소 를 선택 하 십시오.$("[href!='#']") href 값 이"\#"와 같 지 않 은 모든 요 소 를 선택 하 십시오.$("["[href$='.jpg']")모든 href 값 을'.jpg'로 끝 나 는 요 소 를 선택 하 십시오.jQuery CSS 선택 기 jQuery CSS 선택 기 는 HTML 요소 의 CSS 속성 을 바 꾸 는 데 사용 할 수 있 습 니 다.다음 예 는 모든 p 요소 의 배경 색 을 빨간색 으로 변경 합 니 다.인 스 턴 스

 
$("p").css("background-color","red");
jQuery 이벤트 다음은 jQuery 에서 이벤트 방법의 예 입 니 다.
이벤트 함수
바 인 딩 함수~
$(document).ready(function)
문서 에 함 수 를 연결 할 준비 이벤트(문서 가 불 러 올 때)
$(selector).click(function)
선택 한 요소 에 함 수 를 연결 하거나 터치 이벤트
$(selector).dblclick(function)
선택 한 요소 에 함 수 를 연결 하거나 더 블 클릭 이벤트
$(selector).focus(function)
선택 한 요소 에 함 수 를 연결 하거나 초점 이벤트
$(selector).mouseover(function)
선택 한 요소 에 함 수 를 연결 하거나 실행 하 는 마우스 서 스 펜 션 이벤트

좋은 웹페이지 즐겨찾기