728x90
반응형
Jqeury? javascript를 편리하게 사용하기 위해 제작된 라이브러리
순수 자바스크립트의 단점
-코드가 너무 길다.
-센스가없다(고지식하다) 한개일때와 여러개일떄의 코드의 길이(온도차)가 많이난다.
자바스크립트를 사용하기 위해 cnd이나 파일을 불러와야한다.
자바스크립트에서 저장한 코드를 불러오듯이 스크립트 태그에 src 를 이용하여 불러온다
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jQuery기본형식</title>
<!--jQuery cnd또는 보유한 파일을 불러오는 코드를 작성-->
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
<script>
</script>
</head>
<body>
</body>
</html><script>
//vanilla Js코드
// window.addEventListener("load",function(){
//jQuery코드 : 항상 무언가를 선택하면서 시작
//=jquery는 VanilaJS와는 다르게 "추가 준비 작업"필요
//jQuery는 documemt의 ready라는 새로운 시점을 만들어서 이지점을 준비 완료 시점으로 간주
//jQuery(window).on("load",function(){}); window에 load이벤트를 설정하는 코드
//jQuery(document).on("ready",function(){});//jquery가 권장하는 실행시전 (문서 ready 상태)
//jQuery(document).ready(function(){}) //이벤트를 문자열로 설정하는 부분을 다른 명령으로 대체
//jQuery.ready(function(){}); //아무것도 선택시키지않으면 자동으로 doucment가 선택
jQuery(function(){}); //함수만집어넣어도 자동으로 ready이벤트에 대한 처리를 수행한다.
$(function(){});// jQuery도 쓰기 귀찮으니깐 $라는 별칭으로 대체한다.
//주의 = 최근에는 $를 사용하는 라이브러리/프레임워크들이 많기떄문에 충돌이 발생할 경우 해결해야 한다.
$(function(){
$("h1").css("color","red").css("background-color","yellow");
});
</script>
</head>
<body>
<h1>hello jQuery</h1>
<h1>hello jQuery</h1>
<h1>hello jQuery</h1>
<h1>hello jQuery</h1>
<h1>hello jQuery</h1>
</body>
</html>'[LANG] > - Jquery' 카테고리의 다른 글
| [Jquery]addClass(),removeClass(),toggleClass(),hasClass() (0) | 2022.06.04 |
|---|---|
| [Jqeury]Doit _javascript & jquery 시작 (0) | 2022.06.03 |
| [Jquery] jquery로 클래스 제어하기 (0) | 2022.06.03 |
| [Jqurey]애트리뷰트(Attribute) (feat.prop 와 attr (0) | 2022.06.03 |
| [Jquery] jquery로 이벤트 적용 하기 Event (0) | 2022.06.03 |
댓글