반응형
getElementById ()는 요소가 존재하더라도 null을 반환합니다.
이 질문에 이미 답변이 있습니다.
getElementById ()를 사용하여 요소를 가져 오려고하는데 요소가 존재하더라도 null을 반환합니다. 내가 도대체 뭘 잘못하고있는 겁니까?
<html>
<head>
<title>blah</title>
<script type="text/javascript">
alert(document.getElementById("abc"));
</script>
</head>
<body>
<div id="abc">
</div>
</body>
이것을 document
load
이벤트 에 넣어야합니다 . DOM은 abc
스크립트가 실행될 때 까지 도달하지 않았습니다 .
DOM이로드되기 전에 스크립트가 실행됩니다. 이 문제를 해결하려면 다음 window.onload
과 같이 함수에 코드를 배치 할 수 있습니다 .
window.onload = function() {
alert(document.getElementById("abc"));
};
대안은 script
닫는 </body>
태그 앞에 오른쪽 을 배치하는 것입니다 .
로드 이벤트에 연결하지 않으려면 본문 맨 아래에 스크립트를 넣으면 끝에서 실행됩니다.
<html>
<head>
<title>blah</title>
</head>
<body>
<div id="abc">
</div>
<script type="text/javascript">
alert(document.getElementById("abc"));
</script>
</body>
</html>
페이지가 렌더링되기 전에 스크립트가 실행되기 때문입니다.
증명을 위해 다음 속성을 본문 태그에 추가하십시오.
<body onload="alert(document.getElementById('abc'));" >
그러나 그것은 존재하지 않습니다. HTML의 그 시점에는 없습니다. HTML 문서는 프로그램이 실행되는 것처럼 위에서 아래로 구문 분석됩니다. 가장 좋은 해결책은 페이지 하단에 스크립트 태그를 추가하는 것입니다. onload 이벤트에 JavaScript를 첨부 할 수도 있습니다.
반응형
'programing' 카테고리의 다른 글
반복 가능한 객체 및 배열 유형 힌트? (0) | 2021.01.18 |
---|---|
C # 구조체 new StructType () 대 default (StructType) (0) | 2021.01.18 |
asp.net-mvc의 서버에서 텍스트 파일을 읽는 가장 좋은 방법은 무엇입니까? (0) | 2021.01.18 |
"for"문에서`! =`또는`<`를 사용해야합니까? (0) | 2021.01.18 |
파일을 무시하는 방법 grunt uglify (0) | 2021.01.18 |