如何在没有jQuery的情况下进行AJAX调用？

Question

如何在没有jQuery的情况下进行AJAX调用？

如何使用JavaScript进行AJAX调用，而不使用jQuery？

Answer 1

使用“vanilla”JavaScript：<script&nbsp;type="text/javascript">function&nbsp;loadXMLDoc()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;xmlhttp&nbsp;=&nbsp;new&nbsp;XMLHttpRequest(); &nbsp;&nbsp;&nbsp;&nbsp;xmlhttp.onreadystatechange&nbsp;=&nbsp;function()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(xmlhttp.readyState&nbsp;==&nbsp;XMLHttpRequest.DONE)&nbsp;{&nbsp;&nbsp;&nbsp;//&nbsp;XMLHttpRequest.DONE&nbsp;==&nbsp;4 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(xmlhttp.status&nbsp;==&nbsp;200)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;document.getElementById("myDiv").innerHTML&nbsp;=&nbsp;xmlhttp.responseText; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;else&nbsp;if&nbsp;(xmlhttp.status&nbsp;==&nbsp;400)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;alert('There&nbsp;was&nbsp;an&nbsp;error&nbsp;400'); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;else&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;alert('something&nbsp;else&nbsp;other&nbsp;than&nbsp;200&nbsp;was&nbsp;returned'); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;}; &nbsp;&nbsp;&nbsp;&nbsp;xmlhttp.open("GET",&nbsp;"ajax_info.txt",&nbsp;true); &nbsp;&nbsp;&nbsp;&nbsp;xmlhttp.send();}</script>使用jQuery：$.ajax({ &nbsp;&nbsp;&nbsp;&nbsp;url:&nbsp;"test.html", &nbsp;&nbsp;&nbsp;&nbsp;context:&nbsp;document.body, &nbsp;&nbsp;&nbsp;&nbsp;success:&nbsp;function(){ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(this).addClass("done"); &nbsp;&nbsp;&nbsp;&nbsp;}});

Answer 2

我知道这是一个相当古老的问题，但现在有一个更好的API可以在新的浏览器中本地使用。该fetch()方法允许您发出Web请求。例如，从/get-data以下位置请求一些json&nbsp;：var&nbsp;opts&nbsp;=&nbsp;{ &nbsp;&nbsp;method:&nbsp;'GET',&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;headers:&nbsp;{}};fetch('/get-data',&nbsp;opts).then(function&nbsp;(response)&nbsp;{ &nbsp;&nbsp;return&nbsp;response.json();}).then(function&nbsp;(body)&nbsp;{ &nbsp;&nbsp;//doSomething&nbsp;with&nbsp;body;});有关详细信息，请参见此处