웹응용프로그래밍 중간 대비 복습 기본 문서가 HTML5 문서임을 나타낸다. 브라우저에게 HTML5 표준에 따라 페이지를 렌더링하라고 지시한다. HTML 문서의 루트 요소이다. 페이지의 주요 언어가 영어라는 것을 나타낸다. 이것은 접근성과 SEO에 도움을 준다. 문서의 메타 정보를 포함한다. 이 태그 내부에는 title, meta, link 등의 태그가 위치할 수 있다. 문자 인토딩이 UTF-8임을 명시한다. 이로 인해 다양한 언어와 문자가 올바르게 표시된다. 뷰포트의 설정을 제어한다. width=device-width는 디바이스의 스크린 너비에 따라 뷰포트의 크기를 설정한다. initial-scale=1.0은 초기 확대/축소 비율을 설정한다. Document 브라우저 탭에 표시되는 문서의 제목을 설정한다..
script 태그 태그에 사용되는 type='module'과 defer는 Javascript를 로드하고 실행하는 방식을 지정하는 속성이다. 각 속성의 기능과 특징은 다음과 같다. type='module' 이 속성을 사용하면 ECMAScript 모듈로서 로드하게 된다. import와 export 문을 사용할 수 있다. 모듈 스크립트는 항상 defer된 것처럼 동작하므로, 문서 파싱이 완료된 후에만 실행된다. 모듈 스크립트는 기본적으로 CORS 체크를 수행하므로, 다른 출처에서 가져온 모듈을 로드하려면 해당 서버가 적절한 CORS 헤더를 제공해야 한다. 인라인과 외부 모듈 스크립트 모두에 type='module'을 사용할 수 있다. 모듈은 항상 strict mode..
문제 상황 정글 2기 첫 미니프로젝트를 진행하면서 button을 누르면 console.log를 찍도록 했는데, 아무리 버튼을 눌러도 콘솔로그가 찍히지 않았다. 127.0.0.1 - - [07/Apr/2023 18:20:13] "GET /main HTTP/1.1" 200 - 자꾸 내가 쏜 적도 없는 GET 요청이 가서 뭐가 이상한지 몰랐는데, 알고보니 태그 내부의 또는 클릭 시 기본적으로 페이지가 reload된다고 한다. 솔루션 필자가 찾은 해결 방법은 3가지이다. form 태그를 div 태그로 바꾼다. JS에서 preventDefault로 기본동작을 막을 수 있다. btn.addEventListener('click', function(e)) { e.preventDefault(); }); button 태그..
