KIC/JavaScript,CSS
-
day40 - JavaScript(DOM)KIC/JavaScript,CSS 2021. 8. 10. 18:44
[DOM] -> 문서 객체 모델 -> 넓은 의미로는 웹 브라우저가 HTML 페이지를 인식하는 방식이다. -> 좁은 의미로는 document 객체와 관련된 객체 집합 -> 사용시 HTML 페이지에 태그를 추가, 수정, 제거할 수 있다 -> 문서 객체 - 태그를 자바스크립트에서 이용할 수 있는 객체로 만드는 것을 뜻한다. -> 태그를 html 페이지에 존재하는 html이나 body 태그를 뜻함 00 23 00 설명 듣기 [domEx1] 1 번째 h1 태그 2번째 h2 태그 [domEx2] -> DOMContentLoaded는 페이지가 로딩될때 자동으로 지정해두었던 콜백함수를 호출한다. [domEx3] [domEx4] [domEx5] -> #a 는 id .a 는 클래스를 뜻한다. [domEx6] 클릭 횟수: ..
-
VScode - 급작스러운 JavaScrip 404 에러KIC/JavaScript,CSS 2021. 8. 10. 10:36
분명 어제까지만 해도 잘 돌아가던 html 파일들이 계속 404 에러를 내기 시작했다. 당장 실습을 해야되는데 문제가 있어서 머리가 아팠는데 다행이 잘 해결되엇다. 해당 코드가 왜인지 모르겠으나 지워져 있었다. 코드가 없다면 해당 코드를 Valve 위에 추가해주고 경로는 해당 파일 폴더 경로로 지정해 준다. 해당 파일 test.html 을 실행하고 싶고 파일이 C:\practice\test.html 이렇게 저장되어 있다면 docBase="C:\practice" 로 지정해준다.
-
day39 - JavaScript(function, scope, 객체)KIC/JavaScript,CSS 2021. 8. 10. 00:19
[scope] [익명 함수] -> 익명함수는 한 페이지에서 재정의가 가능하다. -> 선언적 함수 또한 top - down으로 재정의가 된다. -> 자바 스크립트에서는 선언적 함수를 먼저 정의하고 후에 익명 함수를 정의하기 때문에 아래 코드는 결과로 익명 함수가 나온다. [객체] -> 자바스크립트는 속성과 메소드를 가질 수 있는 모든것이 객체이다. -> 추천하는 방법은 아니지만 배열과 함수도 객체로 사용할 수 있다고 한다. [JSON] -> JSON의 약자는 Java Script Object Notation 이다. -> stringify는 자바 스크립트의 객체를 JSON형식으로 바꾼다. -> parse는 String type의 json 변수를 Object로 변환해준다. [ex 2] [object2] -> ..
-
day38 - JavaScript(prompt, for문, while, 이중 for문, function, array, parameter, callback)KIC/JavaScript,CSS 2021. 8. 6. 16:34
[prompt] [for문 예제] [while] [이중 for문] [function 예제] -> 한글로 변수나 함수를 선언하는 것은 가능하지만 추천하진 않는다고 한다. [array 예제] [array2] [parameter] ...c -> 전개 연산자 사용: 가변형 배열 생성 [parameter2] -> 전개 연산자 사용 유무 [callback 함수] -> 자바스크립트에서 함수는 object이다. -> 자바 스크립트의 함수는 다른 함수의 인자로 쓰일 수도, 어떤 함수에 의해 리턴될 수도 있다. -> 이러한 함수를 고차 함수 라 부르고 인자로 넘겨지는 함수를 콜백 함수 라고 부른다.
-
day37_1 - JavaScript(CSS 선택자, tag, id, class, border, padding, margin)KIC/JavaScript,CSS 2021. 8. 5. 12:26
[CSS 선택자] [태그 선택자] -> 태그의 영역을 선택하고 이후에 오는 CSS 명령을 해당 영역에 적용한다. -> p [id 선택자] -> 웹 페이지에서 유일무이한 단 하나의 특정 영역을 지정하여 CSS 명령을 적용시킨다. -> id명 앞에 #을 붙인다. [클래스 선택자] -> 두 군데 이상의 특정 영역을 지정하여 동일한 CSS 를 적용할 수 있다. -> 클래스 명 앞에 . 을 붙여야 한다. [selector 우선 순위] -> id selector와 class selector가 같은 태그에 동시에 선언되었다면 id를 적용시킨다. (class 는 적용되지 않는다.) -> selector의 우선순위는 id > class > 태그 > * 이다. [ex] (저는 vscode 환경에서 수행하다 보니 를 생략하..
-
day36 - JavaScript(HTML, CSS, <!DOCTYPE html>, <h1>, image, <table> )KIC/JavaScript,CSS 2021. 8. 4. 23:00
[HTML] -> 웹 페이지 제작에 가장 기본적으로 사용되는 마크업 언어이다. -> Hyper Text Markup Language [HTML 기본 구조] -> DOCTYPE html 이란 웹문서가 어떤 버전의 HTML 언어로 작성되었는지 결정하는 기능 -> 헤드 태그에 title은 이 부부분을 나타낸다. -> 브라우저 상에서 출력되는 실질적인 내용이 담기는 부분 [HTML 예제] 글 제목 1 글 제목 2 글 제목 3 글 제목 4 글 제목 5 글 제목 6 ~ -> 글 제목의 크기를 지정한다. 숫자가 커질수록 작은 글자이다. [예제2] 물고기 -> image는 width, height, title 속성이 있다. title은 사진에 마우스를 올려놓았을 때 출력되는 텍스트이다. [예제3] KTX 열차 시간표 ..