공부하자

제이쿼리 animate() 메소드 : 선택한 요소를 설정한 시간동안 애니메이션 처리 문법 $("selector").animate({ // code }, time, 속도); * 속도 : 애니메이션 속도가 빨랐다 느려지거나 느렸다 빨라지는 등 변화를 주고자 할 때 사용, easing 플러그인 연결 시 설정 가능 - linear : 일정 속도 - swing : 속도가 점점 느려진다 cdnjs.com/libraries/jquery-easing jquery-easing - Libraries - cdnjs - The #1 free and open source CDN built to make life easier for developers A jQuery plugin from GSGD to give advanced ..

제이쿼리 setInterval 메소드 : 원하는 시간을 설정하면 해당 시간을 간격으로 설정한 코드가 자동으로 반복 실행 문법 setInterval(function(){ // 반복 실행할 코드 }, time) // 설정 시간 ex. $(function(){ //제이쿼리 실행 호출 var index = 0; setInterval(function(){ $(".section .box").removeClass("on"); //클래스 초기화 $(".section .box").eq(index).addClass("on"); //선택한 태그에 클래스 추가 index++; // 증가 연산자를 이용하여 설정한 time 마다 반응하게끔 작업 if(index == 3){ // 변수가 3이 되었을때(조건문) index = 0; ..

제이쿼리 slideUp, slideDown, slideToggle 메소드 : 슬라이드 애니메이션 효과를 구현해주는 메소드 문법 $("element").slideUp(time); $("element").slideDown(time); $("element").slideToggle(time); 1. $("element").slideUp(time); : 선택한 요소가 서서히 올라가면서 사라지는 효과 ex. $(".wrap .box").slideUp(2000); // 1000 = 1초 2. $("element").slideDown(time); : 선택한 요소가 서서히 내려가면써 나타나는 효과 ex. $(".wrap .box").slideDown(5000); 3. $("element").slideToggle(time..

제이쿼리 class() 메소드 : class 를 동적으로 추가하거나 삭제하는 메소드 .addClass(), .removeClass(), toggleClass() 문법 $("element").addClass(); $("element").removeClass(); $("element").toggleClass(); 1.$("element").addClass(); : 특정 요소에 새로운 class를 추가 ex. $(".btn").click(function(){ $(".btn").eq(0).addClass("on"); }); 2.$("element").removeClass(); : 특정 요소가 가진 class를 제거 ex. $(".btn").eq(3).removeClass("on"); 3.$("element")...

제이쿼리 CSS() 메소드 : CSS() 메소드를 이용하여 엘리먼트에 인라인 스타일로 스타일을 추가할 수 있다. 제이쿼리에만 있는 기능으로 자바스크립트에는 존재하지 않는다. 여러 스타일을 추가하고자 할때는 세미콜론으로 추가하면 된다. 문법 : $('element').css(); ex. $('.box').css('color','#f00'); $('.box').css({ 'background':'#eee','font-size':'15px' }); $(".btn").parent().css({ "color":"#f69834" }); * attr() 메소드와 css() 메소드의 차이점 : attr() 의 경우 기존의 값을 변경, css() 의 경우 기존의 값에 추가하는 개념 $('element').attr('na..

제이쿼리 : 자바스크립트의 생산성을 향상시켜주는 자바스크립트 라이브러리. html 로드가 끝난 후 실행된다. 사용법 : 상단에 제이쿼리를 불러온 후 사용한다. 제이쿼리를 불러오는 방법은 두가지가 있다. 1. 제이쿼리 사이트에서 파일을 다운받아 상단에 연결하여 사용 2. CDN 주소를 상단에 연결하여 사용 * 브라우저 버전 별 cdn 주소를 연결 할 수도 있다. 브라우저마다 해당 버전 cdn을 연결하는 것이 아니고 연결은 하나만 하되 어느 브라우저에서 뿌리는 cdn을 선택하는 것으로 각 버전마다 응답 시간 및 다운로드 속도가 다르므로 개발자가 선택 할 부분이다. jquery.com/download/ Download jQuery | jQuery link Downloading jQuery Compressed ..

반복문 for : 반복적인 작업을 지시할 때 사용 기본 형태 for(시작 조건, 반복 조건, 반복적으로 할 일){ 조건에 부합하여 반복적인 일이 일어났을 때 실행되는 내용 } ex. for(var i = 0; i < 2000; i++){ console.log(i); } : for (변수 i 는 0, i가 2000보다 작을 때까지, i는 증가) { i의 값을 출력하라 }

조건문 if : 주어진 조건에 충족하면 실행시켜주는 공식 기본 형태 if(조건) { 조건에 참일 경우 실행하는 내용 } 조건에 참이 아닐때 (if ~ else ~) if(조건) { 조건에 참일 경우 실행하는 내용 }else{ 조건에 부합하지 않을 때 실행하는 내용 } 그 외 기타 (if ~ else if ~ else ~ ) if(조건1) { 조건1에 참일 경우 실행하는 내용 }else if(조건2){ 조건2에 참일 경우 실행하는 내용 }else if(조건3){ 조건3에 참일 경우 실행하는 내용 }else{ 모든 조건에 부합하지 않을 때 실행하는 내용 } ex. var a = 10; a--; if(a > 9) { console.log("참") }else if(a > 5){ console.log("조건 2의..

함수(function) : 하나의 로직(프로그래밍)을 필요할 때마다 호출하여 사용할 수 있도록 미리 만들어 놓은 코드 함수의 선언 function 함수명 { 함수 내용 } 함수명() //코드 실행

자바스크립트(Java Script) : 웹 페이지에서 사용자로부터 특정 이벤트나 입력 값을 받아 동적인 처리를 목적으로 고안된 객체 기반의 스크립트 프로그래밍 언어. 제이쿼리(J-Query) : 일종의 자바스크립트 라이브러리로 자바스크립트의 생산성을 향상시키고 사용이 편리하다. 데이터 타입 수(Number), 문자열(String), 불린(Boolean) 수는 연산이 가능한 1,2,10,100... 등등의 숫자 문자열은 연산이 불가능하며 큰따옴표("")나 작은 따옴표('')에 들어간 모든 것 ex. '1', "100", 'true', "학교"... 불린은 true, false 를 말하며 연산이 가능하다. true 는 1, false 는 0 을 의미 ex. 1(Number) + 2(Number) = 3 tr..