HTMLCSSJavaScript
JavaScript_02) 함수와 기본 문법
2025.09.26
학습 목표자바스크립트의 개념과 특징을 이해한다웹에서 자바스크립트를 사용하는 3가지 방법을 파악한다데이터 입출력 방법을 학습한다함수 정의와 호출 방법을 익힌다DOM 조작의 기본 개념을 이해한다- 스크립트 언어의 정의스크립트 언어란 프로그램의 동작을 사용자의 요구사항에 맞게 수행되도록 해주는 용도로 사용된다. 비교적 유연하게 동작하여 쉽게 사용이 가능하다는 특징이 있다.- 자바스크립트의 특징자바스크립트는 웹 브라우저에서 많이 사용되는 인터프리터 방식의 스크립트 언어로 브라우저에 엔진(V8)이 탑재되어 있다.인터프리터 방식은 코드를 한 줄씩 읽어가며 바로 실행하는 방식이다. 실시간으로 텍스트를 분석해서 실행되므로 코드에 문법 오류가 있다면 런타임 시점에 알려준다.- 웹 구성 요소와 자바스크립트의 역할웹은 크게..
HTMLCSSJavaScript
JavaScript_01) 변수
2025.09.22
학습 목표JavaScript의 변수 선언 방법 이해하기var, let, const의 차이점 파악하기JavaScript의 데이터 타입 분류 및 특징 학습하기네이밍 규칙과 베스트 프랙티스 습득하기- var의 문제점과 사용 금지 이유JavaScript에서 var는 초기 변수 선언 방식이지만, 현재는 사용하지 않는다. 가장 큰 문제점은 중복 선언이 가능하다는 점이다.var name = "정진우";var age = 55;age = "오십"; // 타입 변경 가능var name = "김수민"; // 중복 선언 허용console.log(name); // "김수민"실행 결과:김수민- let과 const의 도입let과 const는 ES6에서 도입된 새로운 변수 선언 방식이다.let name2 = "jae";name2 =..
HTMLCSSJavaScript
HTML_05) 하이퍼링크 태그, 입력 양식 및 Form 태그
2025.09.22
하이퍼링크 태그의 기본 개념과 활용법 이해다양한 링크 방식(텍스트, 이미지, 페이지 내 이동) 구현입력양식 관련 태그들의 종류와 특성 파악form 태그의 동작 원리와 서버 통신 방식 학습- 하이퍼링크의 기본 개념하이퍼링크는 웹문서의 가장 핵심적인 기능이다. 클릭을 통해 연결된 곳으로 이동하여 사용을 편리하게 해주는 기능으로, 텍스트나 이미지를 클릭해 다른 링크로 접속하거나 페이지 내에서의 이동이 가능하다.- 기본 하이퍼링크 태그 사용법표시될텍스트 01_글자관련태그 02_목록관련태그 03_표관련태그 04_미디어관련태그주요 속성:href: 연결할 링크 주소를 지정하는 속성- target 속성 활용네이버로이동target 속성 값:_self: 현재 탭에서 열기(기본값)_blank: 새 탭에..
HTMLCSSJavaScript
HTML_04) 미디어, 영역 태그
2025.09.22
HTML 이미지, 오디오, 비디오 태그의 기본 사용법과 필수 속성 이해블록 요소와 인라인 요소의 차이점과 특성 파악div와 span 태그의 활용법과 영역 지정 방식 습득HTML에서 이미지를 삽입하는 태그는 자체 닫힘 태그로, 웹 페이지에 시각적 요소를 추가하는 핵심 역할을 한다.- 기본 문법 -->img 태그의 특징:자체 닫힘 태그: 시작 태그만 존재하고 별도의 닫힘 태그가 없음인라인 요소: 텍스트와 같은 줄에 배치됨필수 속성: src 속성은 반드시 포함되어야 함- src 속성과 이미지 경로src속성불러올 이미지 리소스의 경로를 나타냄경로 지정 방식:상대 경로: ./images/sample.jpg (현재 폴더 기준)절대 경로: /images/sample.jpg (사이트 루트 기준)외부 URL: http..
HTMLCSSJavaScript
HTML_03) 표 태그
2025.09.20
학습 목표HTML 표 태그의 기본 구조와 각 요소의 역할 이해기본적인 테이블 생성 방법과 스타일링 기법 습득colspan과 rowspan 속성을 활용한 고급 테이블 구조 구현시맨틱 테이블 구조(thead, tbody)의 중요성과 활용법 학습HTML 표(Table)는 행(row)과 열(column)로 구성된 2차원 데이터 구조다. 웹 문서에서 정형화된 자료를 정리하고 표현할 때 핵심적인 역할을 한다.- 표 구성 요소표의 기본 구조:행(Row): 수평 방향의 데이터 줄열(Column): 수직 방향의 데이터 줄셀(Cell): 행과 열이 교차하는 지점의 데이터 영역- 기본 표 태그 : 기본적인 표를 생성해주는 태그 : 한 행을 나타내는 태그 : 제목셀을 나타내는 태그 : 일반셀을 나타내는 ..