div를 사용하여 버튼으로 div 위치 변경 JS

Question

버튼을 클릭 할 때 div의 위치를 ​​이동하려고하지만 작동하지 않습니다.

<script> 
    function changePosition1() { 
     document.getElementsByTagName("div").style.top="300px"; 
    } 
</script> 

<button type="button" onclick="changePosition1()">click me</button> 

<div style="position: absolute; height:100px; width:100px; background-color: green;"></div> 

Answer 1

document.getElementsByTagName("div") 때문에 다시 표시 요소 컬렉션이 아닌 단일 요소 : 여기 내 코드입니다.

편집 : 사용 document.getElementsByTagName("div")[0]

Answer 2

getElementsByTagName은 배열을 반환합니다. 당신은 배열의 첫 번째 요소 지정해야하므로

document.getElementsByTagName("div")[0].style.top="300px 

Answer 3

getElementsByTagName 메소드는 배열을 반환 배열의 첫 번째 요소를 시도 :이 ID를 추가하는 것입니다 할

<script> 
function changePosition1() 
{ 
    document.getElementsByTagName("div")[0].style.top="300px"; 
} 
</script> 
<button type="button" onclick="changePosition1()">click me</button> 
<div style="position: absolute; height:100px; width:100px; background-color: green;"></div> 

Answer 4

더 나은 방법을 = "mydiv"를 div에 추가하고 document.getElementById ("mydiv")를 사용하여 div를 참조하십시오.