2. Front-end/2-3. Java Script

JQuery - [ Ajax 기본 사용]

AJAX (Asynchronous JavaScript And XML) - 비동기 방식의 자바스크립트와 XML을 말한다. JSON, XML, HTML 그리고 일반 텍스트 형식 등을 포함한 다양한 포맷을 주고 받을 수 있다. - AJAX의 강력한 특징은 페이지 전체를 리프레쉬 하지 않고서도 수행 되는 "비동기성" 이다. 이러한 비동기성을 통해 사용자의 Event가 있으면 전체 페이지가 아닌 일부분만을 업데이트 할 수 있게 해준다. AJAX의 주요 두가지 특징은 아래의 작업을 할 수 있게 해준다. * 페이지 새로고침 없이 서버에 요청 * 서버로부터 데이터를 받고 작업을 수행 => 즉 주소이동(화면 이동)없이 한 화면에서 내용이 바뀌는 부분은 ajax로 처리한 것이라 볼 수 있다! - 동기 방식 처리 : 서버 ..

JS - [ 이클립스에서 JS 자동완성 사용하기 ]

Help -> Eclipse Marketplace : 여기서 eclipse에 추가할 수 있는 플러그인 검색 가능 Tern 검색 -> Install 선택 (Tern 플러그인 설치했으므로 사용할 수 있는 것 추가로 보여줌!) 프로젝트 이름 우클릭 -> Configure -> Convert to tern project Browser 2개 체크 JQuery 2개 체크 그러면 자바스크립트도 자동완성(ctrl + space bar)로 쓸 수 있음!! 참고로 프로젝트에 적용은 매번 해야됨 설정창 나가면 프로젝트 이름 우클릭 -> Properties -> Javascript -> Tern -> Modules 에서 다시 설정 가능하다!!

JQuery- [ 라이브러리(slick) 설치 ]

https://kenwheeler.github.io/slick/ 이동 get it now 클릭 Download Now 클릭 다운 받은 파일안에서 slick.js 파일을 프로젝트에 설치하고 연결해주면 사용 가능! 사용할 때 slick 함수 안의 코드는 사이트를 참조해서 원하는 걸로 가지고오면 됨! 참고로 다운받은 폴더에서 css파일을 연결해주면 설정된 css내용대로 나옴!

JQuery - [ 기본 사용 ]

https://api.jquery.com/ JQuery API Document 참조 $('선택자').함수(); - $ 기호는 제이쿼리를 의미 - 선택자를 이용하여 원하는 HTML 요소를 선택하고 함수를 정의하여 선택 된 요소에 원하는 동작을 설정할 수 있다. // 태그[속성=값] $('input[type=text]').val('아이티윌'); // 태그[속성^=값] (값으로 시작하는 속성을 찾음) $('input[type=password]').val('1234'); $('input[type^=p]').val('12345678'); // first(처음) / last(끝) // odd(홀수) / even(짝수) $('tr:first').css('backgrou..

JQuery - [ 설치 ]

- JQuery : 자바스크립트의 대표적인 라이브러리 언어(프레임워크) JQuery 설치 https://jquery.com/download/ 이동 제일 위에거 클릭! 더보기 Download the compressed, production jQuery 3.6.0 => 압축된 파일 (주석X, 줄바꿈, 공백 x) Download the uncompressed, development jQuery 3.6.0 => 비압축된 파일 (주석O, 줄바꿈, 공백O) Download the compressed, production jQuery 3.6.0 slim build => 압축된 슬림 파일 파일 (주석X, 줄바꿈, 공백 x, Ajax, 효과 X) Download the uncompressed, development jQ..

JS - [객체의 종류]

1) 내장객체 : 자바스크립트 엔진 내장되어있는 객체 2) 브라우저 객체 모델 (BOM) : 브라우저에 내장된 객체 (계층형 구조) 3) 문서 객체 모델 (DOM) : HTML 문서 구조를 표현하는 객체 1. 내장 객체 - 날짜 정보(시간정보)를 저장하는 객체 * var today = new Date(); 년도 : today.getFullYear() 월 : today.getMonth() (0~11 로 반환) 일 : today.getDate() 시 : today.getHours() 분 : today.getMinutes() 초 : today.getSeconds() * new Date("년/월/일") -> new Date("2022/3/8") * new Dat..