지식공유/html,css,js13 DOM(Document Object Model), BOM(Browser Object Model) 브라우저 객체 모델(BOM / Browser Object Model) - 브라우저에 접근할 수 있는 객체 모델이다 - BOM의 최상위 객체는 window이다 - window, navigator, history, location, document 등 문서 객체 모델(DOM / Document Object Model) - 문서에 접근할 수 있는 객체 모델이다 - DOM의 최상위 객체는 html이다 2022. 7. 12. HTML 노드의 종류(웹퍼블리싱/프론트엔드/html/css/javascript/기초) HTML DOM은 노드(Node)라고 불리는 계층적 단위에 정보를 저장하고 있음. HTML DOM은 이러한 노드들을 정의하고, 그들 사이의 관계를 설명해주는 역할을 함. 노드의 종류 노드 설명 문서 노드(document node) HTML 문서 전체를 나타내는 노드 요소 노드(element node) 모든 HTML 요소는 요소 노드이며, 속성 노드를 가질 수 있는 유일한 노드임. 속성 노드(attribute node) 모든 HTML 요소의 속성은 속성 노드이며, 요소 노드의 관한 정보를 가지고 있음. 하지만 해당 요소 노드의 자식 노드(child node)에는 포함되지 않음. 텍스트 노드(text node) HTML 문서의 모든 텍스트는 텍스트 노드임. 주석 노드(comment node) HTML 문서의.. 2022. 7. 12. html 문서 만들어보기(웹퍼블리싱/프론트엔드/html/css/javascript/기초) 1. 에디터를 실행하여 새파일을 만든다. - File > New File 새파일을 만들면, 다음과 같이 'Untitiled'라는 이름의 새 탭이 생성됨. 2. 생성된 Untitled 문서를 저장한다. - File > Save (또는 Ctrl + S / Cmd + S) - 저장시 파일 경로는 개인이 편한 곳으로 설정. - 파일명 기재시 확장자 명을 html로 적어줘야 함.(예 : test.html) - 나는 임의로 test라는 폴더를 생성 후 그 폴더 안에 test1.html 파일로 저장을 했음. 3. 에디터를 통해 test1.html 문서를 작성한다. - 참고로 저장한 test1.html 파일을 더블클릭 하여 열어보면 브라우저 창이 뜨는데 아무것도 보이지 않을 것이다. (해당 문서에 아무것도 작성하지.. 2020. 7. 22. 코드 에디터 : Sublime Text3 처음 코딩을 시작할때는 코드를 어디에 적어야 할지 전혀 할지 못한다. 그런데 처음 입문자들이 강의를 들을때는 때에 따라 다르긴 하지만 쉽게 이해를 돕기위해 메모장에 코드를 적어 .html 파일로 저장하는 경우도 있고, 한국같은 경우는 에디트플러스를 쓰는 경우도 많이 봤다. 그런데 개인적으로 나만 그런지는 모르겠는데, 코딩에 입문하면서 수많은 영상 강의나 코드가 적혀있는 화면을 볼때면 뭔가 어두운 화면에 여러 색깔의 텍스트가 현란하게 적혀있는걸 봤었고, 그게 꽤 멋있어 보였던것 같은데, 실제 입문 과정에서는 메모장이나 에디트플러스(에디트플러스는 초기 설정의경우 배경이 흰색)로 접하는 경우가 있다보니 뭔가 밋밋한 느낌같은게 있었다. 뭔가 외국 개발자들이 쓰는 에디터(어두운 배경)가 좋아보이고 멋져보였던것 같.. 2020. 6. 13. HTML과 CSS HTML(Hyper Text Markup Language) Hyper Text => 다른 곳으로 연결할 수 있는 기능을 가진 멋진 텍스트 Markup Language => 마크(표기)된 언어 기본적으로 HTML은 문서라고 생각할 수 있다. 이후 HTML의 태그들을 공부하다 보면 알게되겠지만 의 헤딩태그, 문단태그, 줄바꿈 등 문서를 이루는 기본 형태를 표기할 수 있는 태그들로 구성되어있다. 우리가 흔히 오프라인인 책에서 문서를 구성한다면, 온라인에서는 HTML로 문서를 구성한다고 보면된다. 그런데 굳이 저런 태그들을 쓰는 이유는, 컴퓨터가 이해할 수 있도록 사용하기 위해서이다. 인간은 시각적으로 문서의 구조를 보고 구성이 어떻게 되어있는지, 어디가 제목이고 어디가 본문인지를 쉽게 알아 챌 수 있다. .. 2020. 6. 3. 웹표준, 웹접근성 웹을 처음 접하고 배워갈때 웹표준과 웹접근성에 대해서 많이 듣게된다. 그런데 처음에는 그것에 대한 개념을 잡기가 어려울 수도 있다. 뭔가 코딩을 생각하고 html,css,js를 배우고자 마음을 잡고있는 상황에서 이론적인 웹표준과 웹접근성을 들으면 확 와닿기 보다는 뜬구름잡는 것 처름 느껴질 수도 있다. 그래서 오히려 처으메 웹에 대해서 배우면서 웹표준과 웹접근성을 보다 더 쉽게 이해하기 위해서는 그냥 처음부터 간단히 생각하고 받아들이는게 좋은 것 같다. 물론 웹에 대해서 깊이 공부해가다보면 그 하나하나가 얼마나 중요한 의미를 가지고 얼마나 중요한 역할을 갖고 있는지 알게되겠지만 처음 배우는 입장에서는 간단이 이해하는게 제일인 것 같다. 그래서 웹표준과 웹접근성은 무엇인가? 웹표준은 .. 2020. 6. 2. 이전 1 2 3 다음
