반응형 JavaScript3 자바스크립트가 내 코드를 실행하는 진짜 방법 들어가며 | 이상한 자바스크립트의 세계자바스크립트를 처음 배울 때, 누구나 한 번쯤은 이런 경험을 해본 적이 있을 것이다.console.log("선언 전:", name);var name = "김개발";console.log("선언 후:", name); 이 코드를 크롬 개발자 도구에서 실행해보자. 어? 에러가 나지 않고 'undefined'가 출력된다! 분명 name을 선언하기 전에 사용했는데 에러가 안 난다는 게 이상하지 않나요?다른 언어라면 "변수를 찾을 수 없다"는 에러가 났을 텐데 말이에요. 그럼 'let'으로 바꿔보면 어떨까?console.log("선언 전:", name);let name = "김개발";console.log("선언 후:", name); 이번에는 'Uncaught ReferenceE.. 2025. 6. 22. script 태그 defer와 async 언제 써야 할까? 1. 들어가며코딩 공부를 시작하고 여러 튜토리얼을 따라 해보면서 느꼈던 건데, 똑같은 기능을 구현해도 페이지마다 로딩 속도가 다르더라구요. "내가 뭔가 잘못 따라 했나?"하고 코드를 비교해봐도 거의 비슷한데, 유독 어떤 페이지는 빠르고 어떤 페이지는 느린 거예요.그러다가 어떤 강의에서는 "script를 body 끝에 두면 빠르다"고 하고, 또 다른 강의에서는 "defer를 쓰는 게 좋다"고 하더라구요. 처음에는 "둘 다 좋다는 건가? 뭐가 더 나은 거지?"라는 의문이 들었어요.그래서 이 차이점을 제대로 이해해보려고 공부하기 시작했습니다. 2. script 태그 기본 동작 원리처음에는 script 태그가 그냥 "JavaScript 코드를 실행하는 태그" 정도로만 생각했어요. 하지만 브라우저가 HTML.. 2025. 5. 25. DOM의 기초 자바스크립트와 HTML의 만남자바스크립트 적용 전첫 번째 이미지는 웹 페이지의 기본 상태를 보여줍니다. 여기서 `` 태그는 원래의 텍스트를 포함하고 있습니다. 자바스크립트 적용 후두 번째 이미지는 자바스크립트를 통해 `` 태그의 텍스트가 "안녕하세요"로 변경된 후의 상태를 보여줍니다. 이는 웹 페이지가 어떻게 동적으로 조작될 수 있는지를 시각적으로 설명해 줍니다.자바스크립트를 사용하여 DOM에 접근하고 수정하는 것은 웹 개발에서 흔히 볼 수 있는 작업입니다. 이를 통해 개발자는 사용자 인터페이스의 동적인 상호작용을 구현할 수 있습니다. DOM이란 무엇인가?DOM은 Document Object Model의 약자로, HTML 또는 XML 문서의 구조화된 표현입니다.웹 브라우저는 HTML 문서를 불러온 후,.. 2024. 5. 29. 이전 1 다음 반응형
