<jQuery를 배우는 이유.>
Html과 CSS만하면 웹이 딱딱해지기 때문에 jQuery를 사용해서 유연성 있게 하려고 jQuery를 배웁니다.
<jQuery 다운로드>
http://jquery.com/download/ 에 들어갑니다.
▲위에서 다운받으시면 됩니다.
-다운을 안받고 사용하는 법으로는 소스에 그냥 추가하는 법도 있습니다.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="js/jquery-1.11.2.js"></script>
<title>Meta tag</title>
<script type="text/javascript">
$(document).ready(function(){
//여기에 코드 입력
});
</script>
</head>
<body>
</body>
</html>
△저것 처럼 google에서 다운받아 온뒤 script로 링크시키는 방법이 있습니다.
▲(document).ready는 페이지를 다 읽은 뒤 스크립트를 실행하라는 뜻 입니다.
<기억해야할 사항 들>
-jQuery파일 연결을 jQuery사용하는 프로그래밍보다 앞에있어야한다.
-CSS뒤에 자바스트립트 프로그래밍을 추가하기!
-주석을 추가하여 함수가 끝나는 지점 표시!
<jQuery의 동작>
1. HTML요소를 얻는다.
Ex)
<body>, <h1>, <div>등을 얻어서 사용한다.
2. HTML요소로 무언가를 한다.
-HTML요소의 속성변경
-새 콘텐츠 추가
-HTML 요소 제거
-HTML요소 정보추출
-클래스 속성 추가/제거
->이렇게 2가지가 jQuery의 흐름 입니다.
<문서 객체 모델>
옛날에 사용하던 방식으로 DOM(Document Object Model)이 있습니다.
DOM방식과 jQuery방식의 다른점을 봅시다.
var id = document.getElmentById('xxx'); << DOM
var id = $('xxx'); << jQuery
딱 봐도 jquery가 더 편해보입니다.
'Programming > Java Script + jQuery' 카테고리의 다른 글
jQuery 이벤트 사용하기! (0) | 2015.12.16 |
---|---|
jQuery CSS 속성 읽고 바꾸기 & 익명함수 (1) | 2015.12.14 |
jQuery 콘텐츠 추가! (0) | 2015.12.14 |
jQuery 선택자 & 필터 (0) | 2015.12.11 |