0x00 简介 当使用AJAX请求其他域名下的数据时会出现拒绝访问的情况，这是出于安全考虑，AJAX只能访问本地的资源，而不能跨域访问。
当使用AJAX与PHP中的代码请求其他域的数据时会出现下面的情况
至于解决方案的话这里说三种：JSONP、jQuery、CORS。
0x01 JSONP 这里的场景是本地127站点跨域请求远程114.115.214.111站点的数据
<html lang="en"> <head> <meta charset="UTF-8"> <title>jsonptest</title> </head> <body> <script> function callback_func(data) { document.getElementById("txtHint").innerHTML="姓名:"+data.name+"--性别:"+data.sex+"--年龄:"+data.age; } function get_msg(name) { var url = "http://114.115.214.111/wyb/msg.php?name="+name+"&callback=callback_func"; var script = document.createElement('script'); script.setAttribute('src', url); script.setAttribute('id', 'aaabbb'); document.getElementsByTagName('head')[0].appendChild(script); document.getElementById('aaabbb').remove(); } </script> <h3>在输入框中尝试输入姓名(xiaoming):</h3> <form action=""> 输入姓名: <input type="text" onkeyup="get_msg(this.value)" /> </form> <p>提示信息: <span id="txtHint"></span></p> </body> </html> <?php $conn = @mysql_connect('localhost','admin','123456'); mysql_select_db('test',$conn); $name = $_GET['name']; $callback = $_GET['callback']; $sql = "select * from student where name='".
0x00 AJAX与PHP ajax.html代码如下：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script> function showHint(str) { var xmlhttp; if (str.length==0) { document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest) { // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码 xmlhttp=new XMLHttpRequest(); //创建对象 } else { // 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","./ajax.php?q="+str,true); xmlhttp.send(); } </script> </head> <body> <h3>在输入框中尝试输入字母 a:</h3> <form action=""> 输入姓名: <input type="text" id="txt1" onkeyup="showHint(this.value)" /> </form> <p>提示信息: <span id="txtHint"></span></p> </body> </html> 上面的代码会完成以下的东西： 1.
0x00 什么是AJAX AJAX全称是Asynchronous JavaScript and XML，即异步的JavaScript和XML
AJAX不是新的编程语言，而是一种使用现有标准的新方法。
AJAX可在不重新加载整个页面的情况下与服务器交换数据从而更新部分网页
0x01 示例 <!DOCTYPE html> <html> <head> <script> function loadXMLDoc() { var xmlhttp; 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("myDiv").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","/try/ajax/ajax_info.txt",true); xmlhttp.send(); } </script> </head> <body> <div id="myDiv"><h2>使用 AJAX 修改该文本内容</h2></div> <button type="button" onclick="loadXMLDoc()">修改内容</button> </body> </html> 当点击”修改内容”后，文本就会改变，但html页面源码没变，只向服务器请求了文本
0x02 关于XHR XMLHttpRequest是AJAX的基础，就是它与后台就行交互的
现在大部分浏览器都支持XMLHttpRequest对象(IE5和IE6使用ActiveXObject)
//创建对象示例 var xmlhttp; if (window.
