본문 바로가기

전체 글58

자바스크립트 파일로드 중 에러 해결방법 - load, defer, async html 에서 자바스크립트 파일 가져오기 html 파일에 자바스크립트 파일을 넣어 사용해야 하는 경우가 많이 있다. 이 때에는 기본적으로 html 파일에 위와 같은 문제를 해결하는 방법은 여러가지가 있다. 그 중 첫번째는 script 파일이 실행되는 위치를 수정하는 것이다. 기존의 html 파일에서 태그는 태그의 위에 존재했다. 이를 위와 같이 수정하면 btn이라는 id를 가진 DOM이 구성된 후 script.js 파일에서 이를 선택할 수 있게 되어 alert이 정상적으로 동작한다. 해결방법 2. load 이벤트 리스너 등록 // window.onload 사용 console.log('Hello World!'); window.onload = function() { let btn = document.quer.. 2023. 4. 29.
브라우저 객체 모델 알아보기 브라우저 객체 모델(Browser Object Model)이란 스크립트 언어로 웹 브라우저를 제어하기 위해 웹 브라우저를 객체화한 것이다. 때문에 BOM을 브라우저를 제어하기 위한 인터페이스라고도 한다. BOM에는 6가지 종류가 있는데 window, document, history, location, screen, navigator가 그것이다. 여기서 window는 브라우저창 전체를 의미한다. 모든 객체들이 소속되어 있는 가장 큰 객체이다. // 새 창으로 naver 열기 window.open('https://www.naver.com') // 현재 창 닫기 window.close() // 경고창 띄우기 window.alert('경고창') // 같은 코드 alert('경고창') 위의 자바스크립트 코드를 사.. 2023. 4. 28.
DOM의 의미와 document 노드의 활용, querySelector 사용 자바스크립트란 웹 페이지의 구성에 있어서 필요한 언어이다. HTML로 틀이 잡혀있는 웹 페이지를 변경하고 여러 이벤트를 주는 등의 동적인 요소들을 위해 만들어졌다. 여기서 자바스크립트를 이용해서 HTML파일을 제어하기 위해 필요한 것, 그것이 바로 DOM이다. - 해당 글은 짐코딩 님의 프론트엔드 날개달기 강의 중 DOM 이란? 강의를 정리한 내용입니다. DOM의 의미는 무엇일까? 크롬, 사파리, 엣지 등의 다양한 브라우저가 존재한다. 그리고 각 브라우저들은 HTML로 작성된 웹 문서들을 렌더링이라는 작업을 할 수 있는 엔진을 가지고 있다. 여기서 렌더링이란 HTML 태그로 구성된 요소들을 화면에 나타내주는 것을 말한다. 렌더링 엔진들이 HTML코드를 한 줄 한 줄 읽어서 해석하고 해석이 끝나면 전체를 .. 2023. 4. 27.
개발 분야 면접에서 대비해야 할 부분 개발 관련 분야의 경우 기본 인성질문도 받게 되지만 그 외에 다양한 부분에 대한 질문에 대답해야 하는 상황과 부딪힌다. 보통 알고 있는 부분들이 코딩테스트, 기술 관련 질문, 인성질문이 있다. 각 면접들에 대비하는 방법에 대해 알아보고자 한다. (해당 포스팅은 "커리어스킬"을 참고하였습니다) 코딩 문제 풀이 질문에 대비하는 방법 코딩 문제 풀이 같은 경우에는 모든 면접에서 행해지는 부분은 아니다. 하지만 최근 많은 기업들에서 코딩테스트를 면접에서 중요한 부분으로 포함시킨다. 단순히 문제를 해결하는 데에 그치지 않고 데이터 구조에 대한 정확한 이해를 가지고 있는 것이 좋다. 책의 저자는 "코딩 인터뷰 완전 분석"이라는 책을 추천했다. 나의 경험과 생각을 바탕으로 말하자면 한 가지 더 추천할 방법이 있다. .. 2023. 3. 19.