왜이 간단한 AJAX 스크립트가 작동하지 않습니까?

-1

insertAdjacentHTML이 무엇이며 왜 내 스크립트가 작동하지 않는지 설명해 주시겠습니까?왜이 간단한 AJAX 스크립트가 작동하지 않습니까?

<!DOCTYPE html> 
<html> 

<head> 
    <title></title> 
</head> 

<body> 
    <div class="animal-info"> 
    </div> 
    <button id="btn">Ae</button> 
    <script type="text/javascript"> 
    var animalContainer = document.getElementById("animal-info"); 
    var btn = document.getElementById('btn'); 
    btn.addEventListener("click", function() { 
     var request = new XMLHttpRequest(); 
     request.open('GET', 'https://learnwebcode.github.io/json-example/animals-1.json'); 
     request.onload = function() { 
     var ourData = JSON.parse(request.responseText); 
     renderHTML(ourData); 
     }; 
     request.send(); 
    }); 

    function renderHTML(data) { 
     animalContainer.insertAdjacentHTML('beforeend', 'testing 123'); 
    }; 
    </script> 
</body> 

</html>

출처

2017-02-08 Giorgi Macharashvili

id가 'animal-info' 인 요소가 없습니다. –

예상되는 동작과 실제로 발생하는 동작은 무엇입니까? 오류가 있습니까? "효과가 없다"는 것은 유용한 문제 설명이 아닙니다. –

을 가지고 동물 정보의 ID가 없습니다.

document.getElementsByClassName 메서드는 NodeList을 반환합니다.

여기에 working solution입니다.

출처

2017-02-08 23:01:08

왜 내가 바보 같은 실수를 저리 바보로 만들지? ( –

@GiorgiMacharashvili - 답 중 하나를 정답으로 표시하는 것이 좋습니다. –

ofc man 내가 할 것이지만 5 분이 지나야합니다. 대답 –

어떤 요소는 동물 - 정보의 종류 당신은 animal-info 사업부를 선택하기 위해 var animalContainer=document.getElementsByClassName("animal-info")[0];를 사용할 필요가

출처

2017-02-08 23:00:02 Booboobeaker

왜이 간단한 AJAX 스크립트가 작동하지 않습니까?

답변

관련 문제