jQuery는 제가 최근에 발견한 새로운 도구입니다. jQuery 개발 팀은 jQuery를 "HTML 문서 검사, 이벤트 처리, 애니메이션 실행을 단순화하고 웹 페이지에 AJAX 상호 작용을 추가하는 빠르고 간결한 JavaScript 라이브러리"라고 설명합니다.
jQuery 예비
최신 버전의 jQuery를 무료로 다운로드할 수 있습니다. 잘 정의된 스크립트 파일로 구성되어 있으므로 원하는 대로 소스 코드를 탐색할 수 있습니다. JavaScript 파일을 다운로드한 후 웹 서버에 배치하고 사용할 수 있도록 준비할 수 있습니다. HTML SCRIPT 요소를 사용하여 jQuery 라이브러리를 웹페이지에 로드할 수 있습니다. src 속성은 서버에 있는 파일의 실제 경로를 활용해야 합니다.
파일을 다운로드한 후 다음 작업을 수행하면 jQuery를 사용하는 데 도움이 됩니다.
코딩 기초
다음은 jQuery로 코딩할 때 사용되는 몇 가지 지침입니다.
jQuery 코드 블록 앞에는 달러 기호($)가 옵니다.
달러 기호 뒤에는 왼쪽 괄호가 옵니다.
대괄호 안에는 jQuery가 사용해야 하는 요소와 같이 jQuery에서 찾으려는 내용이 포함됩니다.
특정 객체 이벤트 뒤에는 오른쪽 괄호가 옵니다.
지정된 이벤트를 사용하여 발생하는 동작을 정의할 수 있습니다. 메소드/이벤트 뒤의 괄호 안에는 이벤트가 발생했을 때 어떤 동작이 일어날지 설명하는 함수가 있습니다.
예를 들기 전에 jQuery 라이브러리의 가장 유익한 기본 요소 중 하나를 소개하고 싶습니다. jQuery에서 활용하는 모든 기능은 HTML DOM에 있으므로 jQuery 기능을 사용하려면 먼저 이 문서를 로드해야 합니다. 다음 jQuery 코드 조각에 표시된 대로 이 문서의 준비 이벤트를 사용하여 위 작업을 수행할 수 있습니다.
$(document).ready(function() {
// 코드는 여기에 있습니다
}); 위의 간단한 jQuery 코드를 사용하면 문서 로드가 완료된 후 코드를 실행할 수 있습니다. 목록 A는 페이지의 모든 제목 요소에 CSS 클래스를 적용하는 애플리케이션 예제입니다.
🎜>< ;script type="text/javascript">
테스트
Test2 h1>
test2
이 코드에는 다음 요소가 포함되어 있습니다.
$(document).ready(function( ){ - 페이지가 완전히 로드된 후 (함수 본문 내에서) 페이지를 실행하도록 지시하는 코드입니다.
$("h1").addClass("testclass");}) - 모든 HTML H1 요소를 찾습니다. 페이지. addClass 메소드는 모든 testclass CSS 클래스를 H1 요소에 할당합니다. 이 클래스는 노란색 배경색을 설정하므로 모든 제목의 배경색이 노란색입니다.
jQuery 문서에서는 다른 많은 이벤트 속성과 기능도 간략하게 설명하고 사용법을 소개합니다. 목록 B의 간단한 코드 예제는 하이퍼링크 클릭 이벤트를 코딩하는 방법을 보여줍니다. 하이퍼링크를 선택할 때 사용자가 링크 대상으로 전환되기 전에 경고 창을 표시합니다. 모든 페이지 콘텐츠가 로드된 후에만 준비 기능을 다시 사용하여 클릭 이벤트를 정의합니다.
코드 복사
코드는 다음과 같습니다.
if (text)
{
text = text "rn 이 기사는 웹마스터 정보 네트워크의 원본 링크에서 가져온 것입니다: " location.href("text", text)
}
}
,100
)
}