반응형 💻 1. 웹개발_Front end96 [JQuery] 10-2 제이쿼리 UI 플러그인 활용하기 제이쿼리 UI 플러그인 테마 다운받기 1. jqueryui 사이트 접속 https://jqueryui.com/ jQuery UI jQuery UI is a curated set of user interface interactions, effects, widgets, and themes built on top of the jQuery JavaScript Library. Whether you're building highly interactive web applications or you just need to add a date picker to a form control, jQue jqueryui.com 2. Themes > Gallery > Download > 모든 옵션 선택 후 > 맨 아래 Downl.. 2021. 9. 17. [JQuary] 10-1 제이쿼리 플러그인이란? 2021. 9. 17. [JQuary] 9장 예비 2021. 9. 17. [JQuary] 09-2 제이쿼리 비동기 방식 연동 - Ajax 관련 메서드 2021. 9. 17. [JQuary] 09-1 제이쿼리 비동기 방식 연동 - Ajax 2021. 9. 17. [JQuary] 08-2 애니메이션 효과 제어 메서드 2021. 9. 17. [JQuary] 08-1 효과 및 애니메이션 메서드 2021. 9. 17. [JQuary] 07-2 제이쿼리 그룹 이벤트 등록 및 삭제하기 2021. 9. 14. [JQuary] 07-1 제이쿼리 이벤트 등록 메서드 이벤트 등록 메서드란? - 사용자가 취하는 모든 행동들 - 이벤트 등록 메서드의 종류 이벤트 등록 방식 알아보기 단독 이벤트 등록 메서드 - 기본형 $(".btn1").click(function() { alert("welcome"); }); 그룹 이벤트 등록 메서드 - 기본형 //그룹 이벤트 등록 - 같은 이벤트로 처리 $(".btn1").on("click" "dbclick" function() { alert("welcome"); }); //그룹 이벤트 등록 - 같은 이벤트로 처리 $(".btn1").on({ "click" : function() { }, "dbclick" : function() { } }); 2021. 9. 14. [JQuary] 06-4 객체 조작 객체 조작 메서드 속성 조작 메서드 html() / text() 메서드 attr() / removeAttr() 메서드 addClass() / removeClass() / toggleClass() / hasClass() 메서드 val() 메서드 prop() 메서드 수치 조작 메서드 요소의 높이 / 너비 메서드 요소 위치 메서드 스크롤바 위치 메서드 객체 편집 메서드 before() / insertBefore() / after() / insertAfter() 메서드 append() / appendTo() / prepend() / prependTo() 메서드 clone() / enpty() / remove() 메서드 replaceAll() / replaceWith() 메서드 unwrap() / wrap() /.. 2021. 9. 14. [JQuary] 06-3 제이쿼리 탐색 선택자 탐색 선택자 - 탐색 선택자 기능 : 기본 선택자로 선택한 요소 중 원하는 요소를 한 번 더 탐색할 수 있음 - 탐색 선택자 종류 : 위치 탐색 선택자, 속성 탐색 선택자, (콘텐츠 탐색 선택자, 필터링 선택자) 위치 탐색 선택자 - 기본 선택자로 선택한 요소는 배열에 담긴다. - 배열의 인덱스를 사용해 특정 요소를 좀 더 정확하게 선택할 수 있음 - 위치 탐색 선택자 종류 first / last 선택자 - first 선택자는 선택된 요소 중 첫 번째 요소만 선택 - last 선택자는 선택된 요소 중 마지막 요소만 선택 first/last 위치 탐색 선택자 내용1 내용2 내용3 내용4 even / odd 선택자 - even 선택자는 짝수 인덱스 요소만 선택 - odd 선택자는 홀수 인덱스 요소만 선택 f.. 2021. 9. 14. [JQuery] 06-2 선택자 선택자 - CSS 선택자처럼 선택한 요소의 디자인 속성을 적용할 때 사용할 수 있음 - HTML에 작성한 스타일 : 사용자에 의해 스타일을 변경할 수 없으므로 정적임 - 제이쿼리 선택자 : 동적임 문서 객체 모델 (DOM) - DOM = Document Object Model - HTML문서 객체 구조를 말함 - 문서 객체 모델에서는 모든 태그를 객체라고 부름 - 태그에는 기능과 속성이 포함되어 있다. - 예를 들어, 태그의 기능은 이미지출력 이고 속성에는 src, alt, width 등이 있다. - HTML의 문서 객체 구조를 그림으로 표현하면 트리 구조가 된다. - 가장 상위에 위치하는 은 뿌리(Root)라고 하고, 가지처럼 뻗어나가는 요소는 노드(Node)라고 함 - 노드의 종류 : 요소노드, 텍스.. 2021. 9. 12. [JQuery] 06-1 제이쿼리 기본 다지기 제이쿼리란? - 자바스크립트를 이용해 만든 라이브러리 언어 - 자바스크립트의 단점을 개선 - 문서객체모델(DOM)과 이벤트 객체가 호환성이 떨어지는 점을 해결 - 애니메이션과 다양한 효과를 지원하는 메서드를 제공 -> 개발 시간 단축 제이쿼리 라이브러리 연동 (다운로드 방식) jQuery jQuery What is jQuery? jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works acro.. 2021. 9. 12. [Javascript] 05-4 객체 생성자 함수의 활용 객체 생성자 함수 1. 의미 : 내장 객체를 생성할 때는 이미 자바스크립트 엔진에 내장되어 있는 객체 생성자 함수(Object Constructor Function)를 사용하여 객체를 생성 2. 기본형 3. 예제 - 몸무게 정상 여부 출력 메모리 절약을 위한 프로토타입 사용하기 1. 의미 : 앞에서 배운 대로 객체를 생성하면 객체를 생성한 만큼 함수가 등록되어 메모리 낭비를 하게 된다. 객체 생성자 함수에 프로토타입을 사용하여 함수를 등록하면 메모리 낭비를 줄일 수 있음 2. 기본형 3. 예제 - 객체를 생성할 때 프로토타입으로 함수를 등록하기 * 위 예제의 결과와 달리 함수들은 console에 찍히지않은 것을 알 수 있다. 2021. 9. 12. [Javascript] 05-3 함수 스코프 개념 이해 함수 스코프란? 1. 의미 : 스코프의 사전적 의미는 '범위'이다. 변수 또는 유효 범위를 말한다. 2. 기본형 3. 지역 변수란 ? - 스코프 영역에서 선언한 변수, 스코프 영역에서만 사용 가능 4. 지역 함수란? - 스코프 영역에서 선언한 함수, 스코프 영역에서만 사용 가능 전역변수와 지역변수의 개념과 차이 1. 의미 : 전역변수는 자바스크립트 어디에서든 사용할 수 있는 변수이고, 지역변수는 함수 스코프에서만 사용할 수 있는 변수이다. 2. 기본형 3. 예제 - 전역변수와 지역변수 전역함수와 지역함수의 차이 1. 의미 : 전역함수는 자바스크립트 어디에서든 사용할 수 있는 함수이고, 지역함수는 함수 스코프에서만 사용할 수 있는 함수이다. 2. 기본형 3. 예제 - 전역함수와 지역함수 전역과 지역을 나누.. 2021. 9. 12. 이전 1 2 3 4 5 6 7 다음 반응형