[작성일: 2023. 03. 03] DOM(Document Object Model)HTML 태그들을 하나씩 오브젝트화 한 것HTML 페이지의 내용과 모양을 제어하기 위해 사용되는 객체HTML 태그 당 DOM 객체가 하나씩 생성HTML 태그의 포함관계에 따라 Parent-Child 관계로 구성 됨.     BOM(Browser Object Model)자바스크립트를 이용하면 브라우저의 정보에 접근하거나 기능을 제어 가능함.이 때 사용하는 객체 모델을 BOM이라고 부름DOM은 W3C의 표준이지만 BOM은 아님.자바스크립트가 브라우저의 기본적인 기능 요소를 직접 제어하고 관리하는 방법을 제시함.   Window 객체웹 브라우저의 창을 나타내는 객체로 대부분의 브라우저에서 지원함.자바스크립트의 모든 객체, 전역 ..

[작성일: 2023. 02. 25] 함수(function)인자(parameter) : 매개변수(선언부)인수(argument) : 매개변수에 들어가는 값(사용부)함수명은 동사 + 목적어로 작성하는 것이 좋음.function 함수명(parma1, param2, ...) { 코드 작성 return 리턴값;}     Javascript 전역함수eval()eval("2 + 3 * 4") // 14  parseInt()문자열을 정수타입으로 변환함.parseint("32") // 32 출력 isNaN()숫자가 아니면 true, 숫자면 falseisFinite()숫자면 true, 아니면 false     객체(Object)객체의 고유한 속성을 프로퍼티(Property)라고 부르며, 여러 프로퍼티와 값의 쌍으로 표현..

[작성일: 2023. 02. 21] 자바스크립트 대화상자(dialog)사용자 입력 및 메시지 출력사용자에게 메시지를 출력하거나, 입력 받을 수 있는 3개의 대화상자가 있음.   Prompt디폴트 입력값은 생략 가능함.사용자가 입력한 문자열 값을 리턴하지만 아무 값도 입력하지 않으면 "" (빈칸)을 리턴함.취소나 강제로 닫으면 null을 리턴함.chrome등 브라우저의 개발자 도구 > console(F12)prompt("메시지", "디폴트 입력값")var : 자바스크립트의 변수 선언console.log : 변수 값이나 텍스트를 로그로 생성   Confirm확인/취소 버튼을 가진 다이얼로그를 출력함.확인 = true취소 또는 강제종료 = false 리턴confirm("메시지")   Warningalert("..

[작성일: 2023. 02. 18] 자바스크립트(Javascript)퍼즐 조각처럼 코드 형태로 HTML 페이지에 내장됨.컴파일 과정 없이 브라우저 내부의 자바스크립트 처리(interpreter)개발의 발전을 통해 컴파일이 가능해졌으며 Node.js로 서버 환경을 구축함.웹 페이지는 3개의 큰 요소로 구성(html, css, javascript)자바스크립트는 사용자의 입력을 처리하거나 웹 애플리케이션을 작성하는 등 웹 페이지의 동적 제어에 사용됨.[index.html] [웹브라우저]     자바스크립트의 기능사용자의 입력 및 계산HTML의 폼은 입력 창만 제공함.Key, Mouse의 입력 및 계산은 자바스크립트만 가능함.웹 페이지 내용 및 모양의 동적 제어HTML 태그의 속성이나 컨텐..

[작성일: 2023. 02. 16] 반응형 레이아웃(Responsible Layout)웹의 레이아웃을 만들 때 사용자의 해상도를 고려스마트폰이나 태블릿 등은 화면이 작기 때문에 가독성이 중요함.이러한 문제를 해결하고자 하는 방법 중 하나로 해상도에 따라 가로폭이나 배치를 변경함.@media 키워드로 반영형 레이아웃이 가능함.@media ( max-width: 768px) { body { color : red; }     부트스트랩(Bootstrap)세계에서 인기있는 모바일 우선형/반응형 Front-End Framework프레임워크(Framework)패키지: 소스 + 디렉토리라이브러리: 여러 개의 패키지프레임워크가 제공하는 공간에 라이브러리들을 넣을 수 있음.가장 빈번하게 사용되는 CSS, js를 미리 만..

[작성일: 2023. 02. 13] Layout요소(Element, 버튼 등 웹을 구성하는 모든 것) 들을 화면에 배치하는 것기본적으로는 위에서부터 아래로 배치함.웹은 다양한 표현이 가능해야 하므로 속성을 통해 다양한 배치 구현     주요 속성display   block, inlineposition   static, relative, absolute, fixedfloat   left, right     display 속성block벽돌을 쌓듯이 쌓음.div, header, h1~h6, canvas, section, article, ol, ulwidth와 height 값을 지정할 수 있음.     inline한 줄을 다 차지하지 않고 우측으로, 아래쪽으로 빈 자리를 차지하며 흐름.span, br, butt..