Coding/[Web] Frontend 11 [JavaScript] 브라우저 로드 트리거 : DOMContentLoaded vs load DOMContentLoaded, load 호출 시점 DOMContentLoaded HTML이 모두 로드되고 DOM 트리가 완성된 후, 외부 리소스 (img src 등)가 아직 로드되지 않았을 때 실행한다. DOM이 준비 상태이기 때문에 DOM 노드를 제어할 수 있다. jQuery에서의 ready와 유사하다. IE8 이하에서는 지원하지 않았기 때문에 잘 사용되지 않았다. load 브라우저에 모든 리소스(img, style, script 등)이 로드되었을 때 실행한다. DOMContentLoaded보다 로드되는 시점이 늦다. 모든 리소스가 로드된 상태이기 때문에 리소스들의 속성(이미지 크기 등)을 얻을 수 있다. 주요 차이 DOMContentLoaded jQuery에서의 ready와 유사하다. DOM이 준비.. 2023. 3. 27. [CSS] 선택자 선택자 태그로 선택 특정 태그로 작성된 요소들을 선택한다. 태그종류 {...}로 사용할 수 있다. 예를 들어, div {...}는 div 태그로 작성된 요소들을 선택한다. id로 선택 특정 id를 갖는 요소들만 선택한다. #id이름 {...}으로 사용할 수 있다. 예를 들어, #root {...}는 root라는 id를 가지는 요소를 선택한다. 하나의 id는 하나의 요소에만 해당하고, 하나의 요소는 최대 하나의 id만 갖는 것을 원칙으로 한다. class로 선택 특정 class를 갖는 요소들만 선택한다. .class이름 {...}로 사용할 수 있다. 예를 들어, .parent {...}는 parent라는 클래스에 해당하는 요소들만 선택한다. 복합 선택 여러 속성/특성들을 함께 지니고 있는 요소들을 선택할 .. 2023. 3. 21. [HTML] colgroup colgroup colgroup을 이용하면 열에 한번에 같은 스타일을 지정할 수 있다. bgcolor 배경색을 지정할 수 있다. css에서의 배경색처럼 RGB 코드 혹은 사전 정의된 색상 등을 사용하면된다. span col 태그 내의 span 속성을 이용하면 이웃하는 다음 n개의 열까지 포함하여 같은 스타일을 부여할 수 있다. 디폴트는 1이다. 해당열과 다음 열까지 포함하고 싶다면 2가 된다. 그 외 그 외의 속성들은 아래 참고에 링크를 걸어놨으니 확인할 수 있다. 참고 https://developer.mozilla.org/ko/docs/Web/HTML/Element/colgroup - HTML: Hypertext Markup Language | MDN HTML 요소는 표의 열을 묶는 그룹을 정의합니다... 2023. 3. 21. XHTMl XTHML XTHML = HTML + XML eXtendible Hyper Text Markup Language XHTML은 HTMl과 동등한 표현 능력을 지닌 XML Markup language이다. HTMl의 문법에 따르지만 좀 더 명확하고 구조적이다. 즉, 좀 더 엄격하다. HTML을 대체하기 위한 목적으로 만들어진 언어 XHTML이 HTML의 최신 버전으로 오해될 수 있으나, 사실은 별개로 분리된 표준이라고 한다. 배경 웹 콘텐츠가 기존의 전통 컴퓨터에서 벗어나서 다양한 기기들에 사용되기 시작되었다. 이로 인해 부정확한 HTML을 지원하는데 필요한 자원이 부족한 환경이 생겨나게 되었고, 문서가 검사될 수 있도록 문서를 규정하는 XHTML이 등장하였다. 주요 특성 종료 태그가 없는 빈 태그는 스스로.. 2023. 3. 21. Vue.js 기본 Vue.js Vue는 React와 함께 주로 사용되는 frontend framework이다. 데이터가 변경되었을 때 그 부분만 따로 수정하거나 리렌더링할 수 있도록 해주는 등의 reactivity를 위해서 사용된다. Vue.js 공식 레퍼런스 Vue.js - The Progressive JavaScript Framework | Vue.js Versatile A rich, incrementally adoptable ecosystem that scales between a library and a full-featured framework. vuejs.org Vue.js 스타일 가이드 Style Guide — Vue.js Vue.js - The Progressive JavaScript Framework v2.. 2023. 3. 17. 이전 1 2 3 다음
