분류 전체보기
-
[JavaScript] 자바스크립트의 객체 모델 DOM, BOM비전공자 공부일기/:: WEB & Front-End 2020. 6. 19. 10:52
자바스크립트에서 BOM, DOM이라는 개념은 무척 중요한 개념이다. 이전에 국비 과정에서도 배운 적이 있으나, 사실 그 때는 제대로 이해하지 못한 개념이었다. 그런데 '객체'라는 개념을 좀 더 탄탄히 한 후에 다시 보니 이제야 얼추 감이 온다. 어떤 코드가 DOM에 해당되느냐, BOM에 해당되느냐에 따라서 문서와 브라우저가 각기 주도권을 주고받는 과정이 달라져 코드 실행결과가 예상과 달라지기도 한다. 브라우저 객체 모델 BOM (Browser Object Model) 브라우저 객체 모델이란, 말 그대로 브라우저에 대한 모든 내용을 담고있는 객체이다. 브라우저에 관한 정보를 제공하거나 브라우저의 모양을 제어하도록 제공되는 객체들이다. 대표적으로 아래와 같은 객체들이 존재한다. (이보다 훨씬훨씬 많음) - ..
-
-
-
-
-
-
[JavaScript] 조건문과 반복문 - if, switch, for, while, do~while카테고리 없음 2020. 6. 16. 15:33
자바스크립트는 자바와 사용하는 함수명 또는 여러가지 문법들이 놀랍도록 비슷하다. 조건문과 반복문도 거의 그대로 가져다 쓸 수 있다. 단, 반복문에서 변수로 반복횟수를 조절하려 할 경우 변수선언 시 int가 아니라 var 또는 let으로 선언해주는 것만 주의해주면 된다(ㅋㅋ) 자바스크립트의 조건문 if 문 if (조건문) { 실행부; } switch 문 switch(조건문) { case 값1: 어쩌구저쩌구; break; case 값2: 어쩌구저쩌구; break; } 특별히 설명할 필요 없이 완전 동일한 형태인 걸 볼 수 있다. 이미 반복문, 조건문을 접해본 적 있다는 가정 하에 쓰는 글이라 자세한 설명이 없지만 case 다음에 오는 값1, 값2는 문자열 또는 숫자 모두 가능하다. 자바스크립트의 반복문 fo..
-
[JavaScript] 호이스팅(Hoisting)과 var, let, const 변수비전공자 공부일기/:: WEB & Front-End 2020. 6. 16. 13:49
탬플릿 리터럴 백틱(backtick)이란 키보드 숫자키 맨 왼쪽에 있는 ( ` ) 기호를 말한다. 자바스크립트에서는 이 백틱기호를 이용해 문자열을 표현할 수 있는데, 다음과 같은 이점이 있다. 1. 줄바꿈을 쉽게 할 수 있다. -- ` ` 내에서 줄바꿈을 하면 그대로 표현된다. 2. 문자열 내부에 표현식을 포함할 수 있다. -- ${ 표현식 }(달러 브레이슬릿) 형태로 표현식 표현 가능 자바스크립트의 호이스팅(Hoisting) var 변수는 '호이스팅'이라는 현상이 일어난다. 호이스팅이란, 함수 안에 있는 선언들을 모두 끌어올려서 해당 함수 유효범위의 최상단에 선언하는 것을 말한다. ECMA 6부터 새로 도입된 let, const 변수선언문은 호이스팅 현상이 일어나지 않는다. https://gmlwjd9..
-
[JavaScript] 기초비전공자 공부일기/:: WEB & Front-End 2020. 6. 16. 13:29
간단개요 자바스크립트는 동적인 페이지를 표현하기 위한 언어, 동적 제어를 위한 언어이다. 처음 나왔을 때는 각광받지 못했지만, 점점 웹이 무거워지고 동적인 표현들이 필요하게 되면서 최근 자바스크립트가 많이 필요하게 되었다. 자바와 자바스크립트는 이름이 비슷하지만 사실 전혀 다른 언어인데, 자바가 뜨니까 숟가락을 얹기 위해 자바스크립트라는 이름을 붙이게 되었다. 일단 자바는 컴파일 언어인 반면에 자바스크립트는 인터프리터 언어인 것부터 다르다. * ECMA Script ---> 자바스크립트의 표준. 매년 표준안이 나온다. 그러나 업데이트가 빨리 되는편인 건 아님. 자바스크립트 활용 기초 HTML에서 스타일에 대한 제어를 위해서 또는 태그 안에서 document.write("")는 삽입하고 싶은 텍스트를 넣을..
-
[HTML/CSS] 여러가지 자주쓰는 유용한 HTML 태그들 (3)비전공자 공부일기/:: WEB & Front-End 2020. 6. 15. 13:10
ㅁ 요소의 위치에 대한 속성 float : "left, right" --> 왼쪽 또는 오른쪽을 기준으로 요소들이 둥둥 뜬다. 블록태그에서도 visibility : "visible, hidden" --> 영역은 차지하고 있으면서 보이지 않는 것 display : "block, inline, inline-block" --> block태그처럼 쓸지, inline태그처럼 쓸지 설정해줄 수 있다. display : "table-cell" 영역조차 차지하지 않고 사라지는 것 / ㅁ 폰트와 관련된 태그들 font-size : "xx-large, x-large, large, medium(default), small, x-small, xx-small" font-size : "00pt, 00px, 0em" ** 12 pt..