form 객체 - 일반적인 폼 요소에 접근할 때 사용 - document.forms 컬렉션을 이용해서도 접근할 수 있음 아이디 : 비밀번호 : 폼 접근하는 방법 const frm = document.myform; //document.뒤에는 위에 선언한 name의 이름을 적으면 그걸 가져온다는 뜻임. const frm = document.forms['myform']; //이것도 forms에 있는 name의 값을 이용해서 값을 가져옴. 폼 name이 'myform' const frm = document.forms[0]; // 폼 중에서 첫번째 폼을 찾음 const from = document.getElementById('regform'); // id를 이용해서 가져옴 아이디 입력상자에 접근하기 const u..

호이스팅(hoisting) - 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것 - var로 선언한 변수의 경우 호이스팅 시 undefined로 변수를 초기화 - let과 const로 선언한 변수의 경우 호이스팅 시 변수를 초기화하지 않음 함수 fucn1(); 인터프리팅 결과 함수 호이스팅 fucntion func(){ function func1(){ ----------> ....; ...; } } func1(); 익명함수 에러 발생 func2(); let func2(); 변수 호이스팅 func2(); let func2 = function(){ ----------> ....; function func2(){ } ....; } 화살표 함수 - fucntion 키워드를 사용하여 함수를 만..

1. 연산자(Operator) 1. 산술 연산자 +, -, *, /, %, ** 2. 비교 연산자 >, =, true '3' == 3 -> true // 값은 3으로 같으니 true '3' === 3 -> false // 타입이 달라서 false 3. 대입 연산자 =, +, -=, *=, /=, %=, **= 4. 증감 연산자 ++변수, --변수, 변수++, 변수-- ex) let num = 10 ++num // 11 num = num + 1 --num // 10 num = num - 1 num++ // 11 num = num + 1 num-- // 10 num = num - 1 파이썬 ex) num += 1 num = 10 result = ++num // num = 1, result = 11 resul..

자바스크립트(JavaScript) 1. 개발년도 1995년 넷스케이프 커뮤니케이션즈 : 네비게이터 브라우저(90% 이상의 점유율) 1996년 브렌던 아이크 동적인 프로그램을 개발하기 위해 언어를 개발(10일만에 모카라는 언어) 네비게이터2에 탑재(모카 -> 라이브스크립트 -> 자바스크립트) MS의 익스플로러의 jscript 등장 -> 호환성 문제 발생 -> 크로스 브라우징 이슈가 발생 1997년 ECMAScript(비영리 표준화 기구 ECMA 인터내셔널) -> 자바스크립트에서 표준화 1999년 비동기적(Asynchronous) 서버와 브라우저가 데이터를 교환할 수 있는 통신 기능 Ajax(Asynchronous JavaScript and XML)이 탄생 2005년 구글이 크롬 발표(V8 자바스크립트 엔진..

1. CSS 2D 2차원 좌표에서 요소를 변형시키는 속성 - translate: 이동 - rotate: 회줜 - scale: 확대, 축소 - skew: 경사, 비틀기 벤더 프리픽스 (Vender Prefix) - 주요 웹 브라우저 공급자가 새로운 실험적인 기능을 제공할 때 이전 버전의 웹 브라우저에 그 사실을 알리기 위해 사용하는 접두사 - W3C css 권고안에 포함되지 않은 기능이나, 포함되어 있지만 아직 완벽하게 제정된 상태가 아닌 기능을 사용할 때 붙임 -webkit- : 크롬, 엣지를 위한 접두사 -o- : 오페라를 위한 접두사 -ms- : 익스플로러를 위한 접두사 -moz- : 파이어폭스를 위한 접두사 - 해당 속성이 적용되지 않았을 경우 표현해야 할 코드를 가장 먼저 작성해야 하며, 표준 문..

1. Flex 레이아웃 - 수평정렬을 하기 위한 속성 display: flex flex-wrap flex-wrap : 플렉스 라인에 여유가 없을 때 플렉스 요소의 위치를 결정하는 속성 nowrap : 기본값. 플렉스 요소가 다음줄로 넘어가지 않음. 요소의 너비를 줄여 한 줄에 배치 wrap : 플렉스 요소의 여유 공간이 없다면 다음줄로 넘김 wrap-reverse : 플렉스 요소의 여유 공간이 없다면 다음줄로 넘김(단, 아래쪽이 아닌 위쪽으로 넘김) flex-direction flex-direction : 플렉스 요소들이 배치되는 축의 방향을 결정하는 속성 row : 기본값. 가로로 배치되는 row-reverse : 가로로 배치(반대로) column : 세로로 배치 column-reverse : 세로로 ..