Ajax.js
(function(Exports, document, undefined) {"Use strict";functionAjax(){if (! (Thisinstanceof Ajax))ReturnReturnThis } Ajax.prototype = {init:function(opts) {opts = opts | | {};This.opts = opts;This.opts.type = Opts.type | |' Get ';This.opts.url = Opts.url | |‘‘;This.opts.data = Opts.data | |‘‘;This.opts.dataType = Opts.datatype | |' Text ';This.opts.async = Opts.async | |Truethis.opts.success = Opts.success | |NullThis.opts.error = Opts.error | |NullTHIS.XHR =This.createXMLHttpRequest.call (this);This.initEvent.call (this);ReturnThis }, Ajax:function(opts) {This.init.apply (Thisarguments);This.open.call (this);This.send.call (this); }, Createxmlhttprequest:function(){var xhr;try{XHR =New XMLHttpRequest (); }catch (E) {console.log (e);}return XHR; }, Initevent:function(){var _this =ThisThis.xhr.onreadystatechange =function(){if (_this.xhr.readystate = =4 && _this.xhr.status = =200) {if (_this.xhr.status = =200) {if (_this.opts.datatype = = =' Text ' | | _this.opts.datatype = = =' TEXT ') {_this.opts.success && _this.opts.success (_this.xhr.responsetext,' Success ', _THIS.XHR); }Elseif (_this.opts.datatype = = =' XML ' | | _this.opts.datatype = = =' XML ') {_this.opts.success && _this.opts.success (_this.xhr.responsexml,' Success ', _THIS.XHR); }Elseif (_this.opts.datatype = = =' JSON ' | | _this.opts.datatype = = =' JSON ') {_this.opts.success && _this.opts.success (Json.parse (_this.xhr.responsetext),' Success ', _THIS.XHR); } }Elseif (_this.xhr.status! =) {_this.opts.error && _this.opts.error (_THIS.XHR,' Error '); }}}, open:function(){IfThis.opts.type = = =' GET ' | |This.opts.type = = =' Get ') {var str = (typeofThis.opts.data = = =' String ') &&This.opts.data | |This.objectToString.call (Thisthis.opts.data), url = (str = = =") &&This.opts.url | | (This.opts.url.split (‘?‘) [0] +'? ' + str);This.xhr.open (This.opts.type, URL,This.opts.async); }ElseIfThis.opts.type = = =' POST ' | |This.opts.type = = =' Post ') {This.xhr.open (This.opts.type,This.opts.url.split (‘?‘) [0],This.opts.async); }ReturnThis }, send:function(){IfThis.opts.type = = =' GET ' | |This.opts.type = = =' Get ') {This.xhr.send (); }ElseIfThis.opts.type = = =' POST ' | |This.opts.type = = =' Post ') {var str = (typeofThis.opts.data = = =' String ') &&This.opts.data | |This.objectToString.call (ThisThis.opts.data);this.xhr.setrequestheader ( ' Content-type ', application/x-www-form-urlencoded '); this.xhr.send (str);} }, Objecttostring: function ( Data) {if (typeof data!== ' object ' ) return data; var str = "; for (var prop in data) {str + = ' & ' + prop + ' = ' + Data[prop];} return str.slice (1);}} Exports. Ajax = Ajax;}) (window, document);
ajax.php
<?php$c = $_REQUEST[‘c‘];$arr = array( ‘a‘=>2014, ‘b‘=>array(‘c‘=>$c));echo json_encode($arr);
Index.html
<! DOCTYPE html><Htmllang="EN" ><Head><Metacharset="UTF-8" ><Title>ajax</Title></Head><Body><ScriptSrc="Ajax.js" ></Script><Script> New Ajax (). Ajax ({type:' Get ', url:' Ajax.php?c=123 ',If it is a Get method and the URL contains a parameter, its parameters are replaced by dataData: ' c=456 ',//Data parameter format can be a string or an objectData: {c:456}, DataType:' JSON ', async:False, Success:function(data, status, XHR) {console.log (data);}, Error:function(XHR, status) {Console.log (XHR);} });new Ajax (). Ajax ({type: ' post ', url: //if it is a Get method and the URL contains parameters, its parameters will be replaced by data data: Span class= "hljs-string" > ' c=456 ', //data parameter format can be a string or object // Data: {c:456}, DataType: ' text ', success: functionfunction</script></ body></HTML>
JavaScript encapsulates Ajax ($.ajax () method in class jquery)