javascript - 从 $.ajax 移植到 javascript XMLHttpRequest？

Question

寻找一些帮助来使用 XMLHttpRequest 将以下内容从 jquery ajax 转换为 javascript？

$.ajax({
    url: 'api/dev/blah?id=4F',        
    type: 'GET',
    beforeSend: function(req) {
        req.setRequestHeader("Accept", "application/xml");
    },
    success: function (result) {
        alert('success');
        // Parse xml here...
    },
    error: function() { 
        alert('error');
}
});

我试过类似的东西，但我看不到提琴手发送的请求，暗示没有响应或错误（不是 xmlhttprequest savvy）：

function junk() {
  var request = new XMLHttpRequest();
   request.addEventListener('load', successCallback, false);

   request.open("GET", 'api/dev/blah?id=4F', true);
   request.setRequestHeader("Accept","application/xml");
   request.setRequestHeader("Content-Type", "application/xml");
   request.send();
}

function successCallback(data) {
  alert('success');
}

Answer 1

来自Eloquent JavaScript - 第 14 章：

function makeHttpObject() {
  try {return new XMLHttpRequest();}
  catch (error) {}
  try {return new ActiveXObject("Msxml2.XMLHTTP");}
  catch (error) {}
  try {return new ActiveXObject("Microsoft.XMLHTTP");}
  catch (error) {}

  throw new Error("Could not create HTTP request object.");
}

var request = makeHttpObject();
request.open("GET", "api/dev/blah?id=4F", true);
request.setRequestHeader("Accept", "application/xml");
request.setRequestHeader("Content-Type", "application/xml");
request.send(null);
request.onreadystatechange = function() {
    if (request.readyState==4 && request.status==200) {
        console.debug(request.responseText);
    }
};

Answer 2

尝试这个

 request.onreadystatechange = callBackfunction();
 request.send(null);

......

 function callBackfunction()
 {

  if(request.readyState == 4)   
  {
     //alert(request.responseText)
     if(request.status == 200)
      {     
          var xmlDoc = request.responseXML;
      var root = xmlDoc.documentElement;
      var nodesList = root.childNodes; 
      nodeListLen = nodesList.length;

    }// end of if(xmlRequest.status==200)

   } // end of if(xmlRequest.readyState==4)

  } // end of callBackfunction

Answer 3

问题是 XHR 没有响应加载事件。它回应onreadystatechange：

request.onreadystatechange = function(){
    if (request.readyState == 4 && (request.status >= 200 && request.status < 300)) {
        successCallback();
    }
}