-
카테고리
-
세부 분야
웹 개발
-
해결 여부
미해결
질문드립니다.
20.12.24 21:52 작성 조회수 110
0
안녕하세요 강사님 강의재밌게 잘 듣고 있습니다.
질문이 있는데요, 자바스크립트(애니매이션)를 html head부분에 넣을때 오류가 나는데
다음과 같습니다.
답변주시면 감사하겠습니다.
좋은 하루 되세요.
답변을 작성해보세요.
0
1분코딩
지식공유자2020.12.29
<script>가 삽입된 위치가 <svg>의 위치보다 윗줄에 있기 때문에 발생하는 에러입니다.
html 문서는 위부터 아래로 순차적으로 읽어들이기 때문에 스크립트로 svg 엘리먼트에 접근하려는 시점에는 문서가 아직 svg 객체를 로드하지 못했기 때문에, null 값이 나오는 거랍니다.
<script>를 <head>에서 사용하시려면
window.addEventListener('load', () => {
// 여기에 svg 접근 코드 작성
});
또는
window.addEventListener('DOMContentLoaded', () => {
// 여기에 svg 접근 코드 작성
});
이런 식으로 문서의 로딩이 완료된 후 접근하거나,
<script> 위치를 <svg> 이후에 넣어주시면 됩니다.
<body>
<svg>...</svg>
<p>dd</p>
.......
<script></script>
</body>
이렇게요^^
답변 1