JQuery 연구 노트 01 JQuery_jquery와의 첫 접촉-JS 튜토리얼-php.cn

집

웹 프론트엔드

JS 튜토리얼

JQuery 연구 노트 01 JQuery_jquery와의 첫 접촉

May 16, 2016 pm 06:27 PM

jquery 공부 노트

1. 다운로드
공식 홈페이지는 http://jquery.com/
공식 다운로드 주소는 http://docs.jquery.com입니다. /Downloading_jQuery
현재 버전과 이전 버전을 다운로드하여 자체 서버에 배포할 수 있습니다.
GoogleMicrosoftjQuery로 인해 CDN(Content Delivery Network) 주소도 있습니다. jQuery를 널리 사용하려면 CDN 주소를 선택하세요. 이러한 인터넷 거대 기업의 캐시와 대역폭 및 서버 리소스를 최대한 활용할 수 있습니다.
공식 웹사이트에서 다운로드할 수 있는 버전은 압축(축소된 버전)과 압축되지 않은(소스 버전) 두 가지 버전이 있습니다.
전자는 약 70k 더 작으며, 압축되지 않은 버전의 절반도 안되는 크기입니다.
그러나 압축되지 않은 버전은 소스 코드를 읽고 디버그하기가 더 쉽습니다
2. 설치
jQuery 설치는 HTML에서 다운로드한 js 파일을 참조하기만 하면 됩니다
. 예를 들어 <script type="text/javascript" src="/jslibs/jquery.min.js"></script>
CDN을 사용하는 경우 <script type="text/를 직접 인용하세요. javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
3. 첫 번째 프로그램

코드 복사 코드는 다음과 같습니다.

 
<!DOCTYPE html PUBLIC " -//W3C //DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http: //www.w3.org/1999/xhtml"> 
<head> 
<title></title> 
<script type="text/javascript" src="http ://ajax .googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript"> 
 $(function( ) { 경고("hello"); }) 
</script> 
<body> 
</body> ;/html> 

 

페이지 새로고침 후 실행하시면 됩니다.
$가 처음에는 조금 불편할 수도 있지만, 사실 오랫동안 사용하다 보면 익숙해지고 그 단순함이 마음에 들 것입니다. 도저히 참을 수 없다면 "$"를 "jQuery"로 대체할 수도 있습니다.

코드 복사 코드는 다음과 같습니다: $(function() { Alert("hello"); })

은

코드 복사 코드는 다음과 같습니다. $(document).ready(function() { Alert("hello") ; })

기본적으로

코드 복사 와 동일합니다. 코드는 다음과 같습니다. document.onready = function() {alert("hello");}

즉, 브라우저가 완전히 구문 분석한 후 문서 구조에 따라 다음 문을 실행할 수 있습니다. 

document.onload와의 차이점은 onload는 문서 구조를 구문 분석해야 할 뿐만 아니라 로드해야 하는 모든 콘텐츠(예: 사진 등)가 로드될 때까지 기다립니다.
빈번한 작업으로 인해 $(document).ready(fn) 을 사용하여 $(fn) 으로 단순화할 수 있습니다.

본 웹사이트의 성명

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.