는 XMLHttpRequest를

Question

에 아약스 JQuery와 요청을 변경 내가 jQuery로이 Ajax 요청이 있습니다

$(document).ready(function() { 
    var pageName; 

    $('li a').on('click', function(){ 
     pageName = $(this).attr('data-url'); 

     $.ajax({ 
      type: 'GET', 
      url: 'http://mywebsite.com/' + pageName + '/?json=1', 
      contentType: 'application/json', 
      dataType: 'jsonp', 
      success: function(data) { 
       var page = data.content; 
       $('.mypage').html(page); 
      } 
     }) 
    }); 
}); 

을 그리고 내가 XMLHttpRequest를 변경하려면, 그래서 난 이런 짓을 : 그것은 전혀 작동하지 않습니다

function showPage() { 

    var httpRequest = new XMLHttpRequest(); 
    httpRequest.onreadystatechange = function() { 
     if (httpRequest.readyState == 4) { 
      document.getElementById('.mypage').innerHTML = httpRequest.responseText; 
     } 
    }; 

    var attr = document.getElementByTagName(this); 
    var pageName = attr.getAttribute('data-url'); 
    var url = 'http://mywebsite.com/' + pageName + '/?json=1', 

    httpRequest.open('GET', url); 
    httpRequest.send(); 
} 

, 아무도 내가 뭘 잘못했는지 아니?

Answer 1

이 줄은 잘못된 것입니다 :

document.getElementById('.mypage').innerHTML = httpRequest.responseText; 

.로 시작하는 선택은 클래스 선택이 아닌 ID입니다. 다음과 같아야합니다.

document.getElementsByClassName('mypage')[0].innerHTML = httpRequest.responseText; 

이 클래스에는 하나의 요소 만 있다고 가정합니다. 여러 개가있는 경우이를 모두 설정하는 루프로 변경해야합니다.

그러나 XMLHttpRequest를 JSONP dataType과 함께 사용할 수는 없습니다. 원시 자바 스크립트와 JSONP을 구현하는 방법에 대한

JavaScript XMLHttpRequest using JsonP

를 참조하십시오.