ajax - Difference between 2 ways of using AJAX

Question

I want to understand the difference between using AJAX like this,

function showHint(str)
{
var xmlhttp;
if (str.length==0)
  { 
  document.getElementById("txtHint").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","db_update?q="+str,true);
xmlhttp.send();
}

and using it like this..

$.ajax({
     url: "db_update.php",
     type: "POST",
     data: { id: id, state: state },
     cache: false,
     success: function (response) {
         $('#text').html(response);
     }
 });

how different is one from the other? which is efficient?

Answer 1

如评论部分所述，第一个是使用标准 Javascript 来发出 Ajax 请求，而第二个是使用 JQuery。这基本上做同样的事情，但是第二个版本不那么乏味和清晰。关于性能，我猜想 JQuery 应该被优化，所以它不应该有太大的不同。最后它只是一个包装器。通过编写自己的特定代码，您可能会做得更好，但您必须注意跨浏览器兼容性和其他问题，而 JQuery 会为您处理这些问题。