인프런 커뮤니티 질문&답변
작성한 질문수
sdk.js:1 / test.html:12 검색창에 에러입니다.도와주세요
작성
·
111
0
- <!DOCTYPE html>
<html lang="kr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>지도시작하기</title>
<script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=72d6ff41fb27c75f787a525a899ae8ce"></script>
<script>
var container = document.getElementById('map');
var options = {
center: new kakao.maps.LatLng(33.450701, 126.570667),
level: 3
};
var map = new kakao.maps.Map(container, options);
</script>
</head>
<body>
<div id="map" style="width:500px;height:400px;"></div>
</body>
</html>
답변 1
2
Jiwoon Jeong
지식공유자
안녕하세요.
우선 js 코드를 body태그 최하단으로 설정해보시면 될 것 같습니다.
코드는 기본적으로 위에서부터 아래로 해석이 됩니다.
js 코드를 보시면, id가 map인 요소를 선택하는 등 다양한 로직이 있는데,
이는 html 구조가 모두 로드되기 전에 실행되게 됩니다.
이런 이유로 script 태그를 body 태그 최하단에 배치하는 것이라고 이해하시면 되겠습니다.
감사합니다.