본문 바로가기
반응형

전체 글130

[JQuery]기초 정리 — 선택자, 이벤트, 애니메이션, 속성 다루기 jQuery는 자바스크립트를 보다 간편하게 사용할 수 있도록 도와주는 라이브러리입니다. 다양한 선택자와 이벤트 처리, 애니메이션, 속성 조작 등을 매우 간단한 코드로 구현할 수 있다는 장점이 있습니다. 이번 글에서는 jQuery의 기본 선택자, 이벤트 처리, 화면 전환 효과, 애니메이션, 속성 선택자, 값 처리 메서드를 하나씩 정리해 보겠습니다. 1. jQuery 기본 선택자HTML 요소를 선택할 수 있는 다양한 방법입니다. CSS 선택자와 거의 동일하게 사용되며, 요소의 ID, 클래스, 태그 등으로 지정할 수 있습니다.$(document).ready(function() { $("p").css("border", "3px solid red"); // 태그 선택자 $("#gnb.. 2024. 7. 24.
[JQuery] JQuery(제이쿼리)란? 1. 제이쿼리(jQuery)란?jQuery는 자바스크립트를 보다 간단하고 효율적으로 사용할 수 있도록 만든 오픈 소스 기반의 자바스크립트 라이브러리입니다. 복잡한 DOM 조작, 이벤트 처리, AJAX, 애니메이션 등을 짧고 직관적인 코드로 작성할 수 있어 웹 개발자들 사이에서 널리 사용되고 있습니다. 2. jQuery의 주요 특징문법 단순화: 자바스크립트보다 더 짧고 직관적인 문법크로스 브라우징 지원: 브라우저 간의 호환성 문제를 줄여줌풍부한 플러그인: 슬라이드, 팝업, 탭 등 다양한 기능을 플러그인으로 구현 가능DOM 제어 및 이벤트 처리를 간단하게 구현 가능3. jQuery 공식 사이트 및 다운로드제이쿼리는 공식 웹사이트에서 직접 다운로드할 수 있습니다. https://jquery.com/downlo.. 2024. 7. 23.
[JavaScript] 자바스크립트 이벤트, 날짜, Math 메소드, 팝업창 정리 자바스크립트를 활용하여 동적인 웹사이트를 만들기 위해 반드시 알아야 할 핵심 기능들을 정리합니다. 이번 글에서는 이벤트 처리, 날짜 및 시간 함수, 수학 메소드, 팝업창 열기 등 다양한 기능을 실습 예제와 함께 소개합니다. 1. 이벤트(event)란?이벤트란 웹 브라우저에서 발생하는 HTML 요소에 대한 사용자의 행동(클릭, 입력 등)을 의미합니다. 예를 들어 버튼 클릭, 마우스 이동, 키보드 입력 등이 이벤트에 해당합니다. ▶ 이벤트 타입(event type)이벤트의 종류를 식별하는 문자열입니다.자주 사용되는 이벤트 타입: click, keydown, submit, change, mouseover 등▶ 이벤트 예제 코드// 상세 설명 보기document.querySelector('#open').oncl.. 2024. 7. 19.
[JavaScript] 자바스크립트 함수, 배열, 변수 완전 정리 이번 포스팅에서는 자바스크립트에서 자주 사용되는 함수(function), 배열(array), 변수(variable)의 개념과 문법을 정리합니다. 실습 예제도 함께 포함되어 있으므로 직접 코딩하며 익히기 좋습니다. 1. 함수(function)란?함수는 하나의 특별한 목적을 수행하도록 정의된 독립적인 코드 블록입니다. 필요할 때마다 호출하여 해당 작업을 반복적으로 처리할 수 있습니다.function 함수이름(매개변수1, 매개변수2,...) { 실행할 코드;} 2. 함수의 반환(return)return 키워드를 사용하면, 함수는 실행 결과를 호출한 곳에 돌려줍니다. 반환과 동시에 함수 실행은 종료됩니다.function multiply(a, b) { return a * b;}let result = mul.. 2024. 7. 18.
[JavaScript] 자바스크립트 기초 정리 – 변수, 연산자, 조건문, 반복문 자바스크립트(JavaScript)는 웹 페이지를 동적으로 동작하게 만드는 핵심 언어입니다. 이번 포스팅에서는 자바스크립트의 변수 선언, 연산자, 조건문, 반복문에 대해 예제를 중심으로 간단히 정리하였습니다. 1. 변수의 선언과 타입자바스크립트에서 변수는 var, let, const 키워드로 선언합니다.let x = 10;const y = 20;변수는 타입을 명시하지 않아도 됩니다.같은 변수에 다른 타입의 값을 여러 번 대입할 수 있습니다.단, let이나 const로 중복 선언은 불가능합니다. 2. 자바스크립트의 다양한 연산자산술 연산자let a = 10;let b = 5;a + b // 덧셈a - b // 뺄셈a * b // 곱셈a / b // 나눗셈a % b // 나머지 복합 대입 연.. 2024. 7. 17.
[JavaScript] 자바스크립트(JavaScript) 시작하기 – 웹의 동작을 제어하는 핵심 기술 자바스크립트(JavaScript)는 웹사이트에 동적인 기능을 부여하는 객체 기반 스크립트 언어입니다. HTML이 구조를, CSS가 디자인을 담당한다면, 자바스크립트는 웹페이지의 동작과 인터랙션을 구현합니다. 1. 자바스크립트의 역할웹 요소를 제어하고 스타일을 변경하거나 애니메이션을 구현마우스 이벤트, 폼 검증, 모달 창 제어 등 다양한 UI 기능 구현Node.js를 이용하면 프론트엔드뿐 아니라 백엔드에서도 사용 가능브라우저 뿐만 아니라 모바일 앱, 서버 개발 등 다방면에서 활용 2. 자바스크립트란?자바스크립트는 다음과 같은 특성을 가진 언어입니다.객체(Object) 기반의 스크립트 언어HTML과 CSS와 함께 웹 개발의 필수 요소브라우저에 기본적으로 내장된 인터프리터 언어정적 타입이 아닌 동적 타입, 실.. 2024. 7. 16.
반응형

티스토리툴바