jQuery的ajax 简单解析与实现

来源：广州中睿信息技术有限公司官网

发布时间：2012/10/21 23:25:16 编辑：editor 阅读 4718 次

以下的内容只是个人的理解,技术有限,如有问题请指正(看得jq版本是1.3.2)jQuery的ajax,就是我看的和理解,可以用在3个方面,一个是取一个script地址并执行一些操作$jQuery.g

以下的内容只是个人的理解,技术有限,如有问题请指正(看得jq版本是1.3.2)

jQuery的ajax, 就是我看的和理解,可以用在3个方面,一个是取一个script地址并执行一些操作 $jQuery.getScript; 一个是jsonp $jQuery.getJSON;还有一个就是一般的ajax应用了我主要记录的是jsonp 和 ajax 这方面的个人理解..

jsonp

我的理解是:
创建一个全局的回调函数(假如是handler)
在创建一个<script>标签,去请求一个服务器端的地址(假如是http://www.xxx.com, 写在script标签里面就是 http://www.xxx.com?callback=handler callback是跟别人约定好的,也可以不要callback 别人主要是通过这个约定好的callback取到函数名 handler 然后返回一个可以执行的js)
服务器端返回一个可以执行的js代码 (假如是 handler({name : "hello world"}))

一个简单的例子

上面的handler是 gg函数请求的地址是 http://active.zol.com.cn/guofeng/profile2.php?callback=gg

截图为证

返回的是

页面上多了一段可以执行的script

jQuery里面有个默认配置

ajaxSettings: {             //url: location.href,             global      : true,             type        : "GET",             contentType : "application/x-www-form-urlencoded",             processData : true,             async       : true,             /*             timeout: 0,             data: null,             username: null,             password: null,             */             // Create the request object; Microsoft failed to properly             // implement the XMLHttpRequest in IE7, so we use the ActiveXObject when it is available             // This function can be overriden by calling jQuery.ajaxSetup             xhr:function(){                 return window.ActiveXObject                      ? new ActiveXObject("Microsoft.XMLHTTP")                      : new XMLHttpRequest();             },             accepts: {                 xml: "application/xml, text/xml",                 html: "text/html",                 script: "text/javascript, application/javascript",                 json: "application/json, text/javascript",                 text: "text/plain",                 _default: "*/*"             }         }

accepts 是设置请求头 accepts里面的配置项

type 是提交类型

async 是是否异步 true 表示异步

processData 是否修改data的结构如果是true 表示修改

ifModified 如果设置了这一项就要设置http请求头里面的 If-Modified-Since

contentType 设置请求头contentType的类型

application/xml;

application/x-www-form-urlencoded

application/json

application/xml;

参数传递用<xml>

截图为证

application/x-www-form-urlencoded 参数传递用就是一般的字符串

截图为证

application/json 参数传递是json形式的(cnblogs就是这样的形式)

截图为证

jquery.ajax的前部分主要是对jsonp 和创建script 的处理

jq的jsonp的用法是 callback=? 要以这种形式

所以前面部分就是判断url 是不是这中形式不是这中形式就转成这种形式

同时创建一个全局的变量当函数回掉的时候执行该函数

View Code

//extend 的第一个参数为true 表示深度复制              //创建一个新的对象 jq.ajaxSettings全部copy过去 把s复制过去             s = jq.extend(true, s, jq.extend(true, {}, jq.ajaxSettings, s));             var jsonp,                 // jsonp 的回调函数名字要以这种方式才行                 jsre = /=\?(&amp;|$)/g,                 status,                 data,                 type = s.type.toUpperCase();                              //如果data不是字符串 转成字符串             if ( s.data &amp;&amp;  typeof s.data !== "string" )                 s.data = jq.param(s.data);             if ( s.dataType == "jsonp" ) {                 if ( type == "GET" ) {                     if ( !s.url.match(jsre) ){                         //get 方式 参数都在url的后面                         //如果没有=?这种形式 就转成这种形式  这是jq的jsonp形式  后面要把?变成函数名                         //转成这种形式 http://www.xxx.com?callback=?                         s.url += (s.url.match(/\?/) ? "&amp;" : "?") + (s.jsonp || "callback") + "=?";                                         }//http://www.baidu.com?callback=?                 } else if ( !s.data || !s.data.match(jsre) ){                     //post方式 有专为存放参数的地方  这里是把参数和回调都转一下                      //形式 xx=xx&amp;oo=oo.......&amp;callback=?                         s.data = (s.data ? s.data + "&amp;" : "") + (s.jsonp || "callback") + "=?";                 }                 s.dataType = "json";             }             // url 符合 定义的jsonp形式 或者 s.data符合jsonp形式             if ( s.dataType == "json" &amp;&amp; (s.data &amp;&amp; s.data.match(jsre) || s.url.match(jsre)) ) {                 // 这里的jsonp 就是后面的可执行函数的 函数名了                 jsonp = "jsonp" + jsc++;                                  // Replace the =? sequence both in the query string and the data                 // /=\?(&amp;|$)/g                 //将 ? 转 成函数名字                 if ( s.data )                     s.data = (s.data + "").replace(jsre, "=" + jsonp + "$1");                 s.url = s.url.replace(jsre, "=" + jsonp + "$1");                 s.dataType = "script";                      // 定义全局的函数名了 后面请求完毕后就会执行这个函数                 window[ jsonp ] = function(tmp){                     data = tmp;                     success();                     //complete();                     // Garbage collect                     window[ jsonp ] = undefined;                     try{ delete window[ jsonp ]; } catch(e){}                     if ( head )                         head.removeChild( script );                 };             }             if ( s.dataType == "script" &amp;&amp; s.cache == null )                 s.cache = false;                  /*if ( s.cache === false &amp;&amp; type == "GET" ) {                 var ts = now();                 // try replacing _= if it is there                 //alert(s.url)  http://www.baidu.com?callback=jsonp1315980993828                 var ret = s.url.replace(/(\?|&amp;)_=.*?(&amp;|$)/, "$1_=" + ts + "$2");                 // if nothing was replaced, add timestamp to the end                 s.url = ret + ((ret == s.url) ? (s.url.match(/\?/) ? "&amp;" : "?") + "_=" + ts : "");             }*/             // If data is available, append data to url for get requests             if ( s.data &amp;&amp; type == "GET" ) {                 //加上其他的参数                 s.url += (s.url.match(/\?/) ? "&amp;" : "?") + s.data;                      // IE likes to send both get and post data, prevent this                 //ie的 get post 都会传送s.data   好像就是这个意思  所以节省开支                 s.data = null;             }                          // Watch for a new set of requests             //if ( s.global &amp;&amp; ! jQuery.active++ )             //    jQuery.event.trigger( "ajaxStart" );                  // Matches an absolute URL, and saves the domain             //取url的 前面的信息 和 域名             var parts = /^(\w+:)?\/\/([^\/?#]+)/.exec( s.url );                          if ( s.dataType == "script" &amp;&amp; type == "GET" &amp;&amp; parts             &amp;&amp; ( parts[1] &amp;&amp; parts[1] != location.protocol || parts[2] != location.host )){                 var head = document.getElementsByTagName("head")[0];                 var script = document.createElement("script");                 script.src = s.url;                 if (s.scriptCharset)                     script.charset = s.scriptCharset;                      //如果不是jsonp方式  就是创建一个script标签                 if ( !jsonp ) {                     //保证回调函数只执行一次                     var done = false;                          // Attach handlers for all browsers  兼容所有的浏览器的写法                     script.onload = script.onreadystatechange = function(){                         if ( !done &amp;&amp; (!this.readyState ||                                 this.readyState == "loaded" || this.readyState == "complete") ) {                             done = true;                             //success();                             //complete();                             // Handle memory leak in IE  jq里面可以说反复的强调了 删除元素时 该dom元素引用的对象要断开引用  不然会内存泄露                             script.onload = script.onreadystatechange = null;                             head.removeChild( script );                         }                     };                 }                     head.appendChild(script);                     // We handle everything using the script element injection                 return undefined;             }

jQuery.ajax 的后面的部分就是处理ajax的了

jq有专门的设置请求头的部分

其中的 If-Modified-Since 比较重要了

jq里面用 jquery.lastModified 来保存最后的修改时间的

形式是 jquery.lastModified[url] = 时间

按我的理解是

我发送一次请求后服务器看在 If-Modified-Since 里面的时间后有没有做修改,没有做修改返回304 读缓存的文件有做修改返回200

这么做的好处是可以节约网络资源咯

jq1.3.2里面是设置的定时器去判断请求是否已经完成

onreadystatechange是定时器去执行的函数

如果设置了s.timeout

会在这个时间后去查看是否已经xhr的状态是否已经完成了回调如果没有 abort 终止掉请求

jq还有一些方法配合 ajajx

jquery.httpSuccess

jquery.httpNotModified

jquery.httpData

jquery.httpSuccess

判断请求是否已经成功了

jquery.httpNotModified

判断服务器那边是否已经做过了修改

jquery.httpData

因为返回的数据是根据请求头的content-type来的,所以要对不同的数据做处理

因为返回的数据是根据请求头的content-type来的,所以要对不同的数据做处理在这里又对 xml script json 的处理其中script 用到了jquery.globalEval

一个完整的例子

<!DOCTYPE html >  <html xmlns="http://www.w3.org/1999/xhtml">  <head>  <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  <title></title>  </head>  <body>  <script type="text/javascript">  (function(undefined){  var win = this,  toString = Object.prototype.toString;  function now(){  return +new Date;  }  var jsc = now();  win.jq = {  isFunction : function(obj){  return toString.call(obj) === "[object Function]";  },  isArray : function(obj){  return toString.call(obj) === "[object Array]";  },  each   : function(object, callback, args){  var name, i = 0, length = object.length;  if ( args ) {  if ( length === undefined ) {  for ( name in object )  if ( callback.apply( object[ name ], args ) === false )  break;  } else  for ( ; i < length; )  if ( callback.apply( object[ i++ ], args ) === false )  break;  } else {  if ( length === undefined ) {  for ( name in object )  if ( callback.call( object[ name ], name, object[ name ] ) === false )  break;  } else  for ( var value = object[0];  i < length && callback.call( value, i, value ) !== false; value = object[++i] ){}  }  return object;  },  extend : function(){  var target = arguments[0] || {}, i = 1, length = arguments.length, deep = true, options;  if ( typeof target === "boolean" ) {  deep = target;  target = arguments[1] || {};  i = 2;  }  if ( typeof target !== "object" && Object.prototype.toString.call(target)!="[object Function]")  target = {};  for(;i<length;i++){  if ( (options = arguments[ i ]) != null )  for(var name in options){  var src = target[ name ], copy = options[ name ];  if ( target === copy )  continue;  if ( deep && copy && typeof copy === "object" && !copy.nodeType ){  target[ name ] = arguments.callee( deep, src || ( copy.length != null ? [ ] : { } ), copy );  }  else if(copy !== undefined)  target[ name ] = copy;  }  }  return target;  },  param : function(a){  var s = [];  function add(key,value){  s[s.length] = encodeURIComponent(key) + '=' + encodeURIComponent(value);  };  if(jq.isArray(a)){  jq.each(a,function(){  add(this.name,this.value);  });  }else{  for(var j in a){  if(jq.isArray(a[j]))  jq.each(a,function(){  add(this.name,this.value);  });  else  add( j , jq.isFunction(a[j]) ? a[j]() : a[j] );  }  };  return s.join("&").replace(/%20/g, "+");  },  // Determines if an XMLHttpRequest was successful or not  httpSuccess: function( xhr ) {  try {  // IE error sometimes returns 1223 when it should be 204 so treat it as success, see #1450  return !xhr.status && location.protocol == "file:" ||  ( xhr.status >= 200 && xhr.status < 300 ) || xhr.status == 304 || xhr.status == 1223;  } catch(e){}  return false;  },  // Determines if an XMLHttpRequest returns NotModified  httpNotModified: function( xhr, url ) {  //判断 服务器那边是否已经做过了修改  try {  var xhrRes = xhr.getResponseHeader("Last-Modified");  // Firefox always returns 200. check Last-Modified date  // 好像 firefox无视是否修改吗  没测试过  return xhr.status == 304 || xhrRes == jq.lastModified[url];  } catch(e){}  return false;  },  httpData: function( xhr, type, s ) {  var ct = xhr.getResponseHeader("content-type"),  xml = type == "xml" || !type && ct && ct.indexOf("xml") >= 0,  //判断返回的是xml还是字符串  data = xml  ? xhr.responseXML  : xhr.responseText;  if ( xml && data.documentElement.tagName == "parsererror" )  throw "parsererror";  // Allow a pre-filtering function to sanitize the response  // s != null is checked to keep backwards compatibility  //if( s && s.dataFilter )  // data = s.dataFilter( data, type );  // The filter can actually parse the response  if( typeof data === "string" ){  // If the type is "script", eval it in global context  //如果类型是script  则创建一个标签 并且执行data里面的内容  if ( type == "script" )  jq.globalEval( data );  // Get the JavaScript object, if JSON is used.  if ( type == "json" )  data = window["eval"]("(" + data + ")");  }  return data;  },  handleError : function(){  },  // Evalulates a script in a global context  globalEval: function( data ) {  if ( data && /\S/.test(data) ) {  // Inspired by code by Andrea Giammarchi  // http://webreflection.blogspot.com/2007/08/global-scope-evaluation-and-dom.html  var head = document.getElementsByTagName("head")[0] || document.documentElement,  script = document.createElement("script");  script.type = "text/javascript";  //if ( jQuery.support.scriptEval )  //script.appendChild( document.createTextNode( data ) );  //else  script.text = data;  // Use insertBefore instead of appendChild  to circumvent an IE6 bug.  // This arises when a base node is used (#2709).  head.insertBefore( script, head.firstChild );  head.removeChild( script );  }  },  get: function( url, data, callback, type ) {  // shift arguments if data argument was ommited  if ( jq.isFunction( data ) ) {  callback = data;  data = null;  }  return jq.ajax({  type     : "GET",  url      : url,  data     : data,  success  : callback,  dataType : type  });  },  getScript: function( url, callback ) {  return jq.get(url, null, callback, "script");  },  getJSON: function( url, data, callback ) {  return jq.get(url, data, callback, "json");  },  ajaxSettings: {  //url: location.href,  global      : true,  type        : "GET",  contentType : "application/x-www-form-urlencoded",  processData : true,  async       : true,  /*  timeout: 0,  data: null,  username: null,  password: null,  */  // Create the request object; Microsoft failed to properly  // implement the XMLHttpRequest in IE7, so we use the ActiveXObject when it is available  // This function can be overriden by calling jQuery.ajaxSetup  xhr:function(){  return window.ActiveXObject  ? new ActiveXObject("Microsoft.XMLHTTP")  : new XMLHttpRequest();  },  accepts: {  xml: "application/xml, text/xml",  html: "text/html",  script: "text/javascript, application/javascript",  json: "application/json, text/javascript",  text: "text/plain",  _default: "*/*"  }  },  lastModified : {},  ajax : function(s){  //extend 的第一个参数为true 表示深度复制  //创建一个新的对象 jq.ajaxSettings全部copy过去 把s复制过去  s = jq.extend(true, s, jq.extend(true, {}, jq.ajaxSettings, s));  var jsonp,  // jsonp 的回调函数名字要以这种方式才行  jsre = /=\?(&|$)/g,  status,  data,  type = s.type.toUpperCase();  //如果data不是字符串 转成字符串  if ( s.data && s.processData&&typeof s.data !== "string" )  s.data = jq.param(s.data);  if ( s.dataType == "jsonp" ) {  if ( type == "GET" ) {  if ( !s.url.match(jsre) ){  //get 方式 参数都在url的后面  //如果没有=?这种形式 就转成这种形式  这是jq的jsonp形式  后面要把?变成函数名  //转成这种形式 http://www.xxx.com?callback=?  s.url += (s.url.match(/\?/) ? "&" : "?") + (s.jsonp || "callback") + "=?";  }//http://www.baidu.com?callback=?  } else if ( !s.data || !s.data.match(jsre) ){  //post方式 有专为存放参数的地方  这里是把参数和回调都转一下  //形式 xx=xx&oo=oo.......&callback=?  s.data = (s.data ? s.data + "&" : "") + (s.jsonp || "callback") + "=?";  }  s.dataType = "json";  }  // url 符合 定义的jsonp形式 或者 s.data符合jsonp形式  if ( s.dataType == "json" && (s.data && s.data.match(jsre) || s.url.match(jsre)) ) {  // 这里的jsonp 就是后面的可执行函数的 函数名了  jsonp = "jsonp" + jsc++;  // Replace the =? sequence both in the query string and the data  // /=\?(&|$)/g  //将 ? 转 成函数名字  if ( s.data )  s.data = (s.data + "").replace(jsre, "=" + jsonp + "$1");  s.url = s.url.replace(jsre, "=" + jsonp + "$1");  s.dataType = "script";  // 定义全局的函数名了 后面请求完毕后就会执行这个函数  window[ jsonp ] = function(tmp){  data = tmp;  success();  //complete();  // Garbage collect  window[ jsonp ] = undefined;  try{ delete window[ jsonp ]; } catch(e){}  if ( head )  head.removeChild( script );  };  }  if ( s.dataType == "script" && s.cache == null )  s.cache = false;  /*if ( s.cache === false && type == "GET" ) {  var ts = now();  // try replacing _= if it is there  //alert(s.url)  http://www.baidu.com?callback=jsonp1315980993828  var ret = s.url.replace(/(\?|&)_=.*?(&|$)/, "$1_=" + ts + "$2");  // if nothing was replaced, add timestamp to the end  s.url = ret + ((ret == s.url) ? (s.url.match(/\?/) ? "&" : "?") + "_=" + ts : "");  }*/  // If data is available, append data to url for get requests  if ( s.data && type == "GET" ) {  //加上其他的参数  s.url += (s.url.match(/\?/) ? "&" : "?") + s.data;  // IE likes to send both get and post data, prevent this  //ie的 get post 都会传送s.data   好像就是这个意思  所以节省开支  s.data = null;  }  // Watch for a new set of requests  //if ( s.global && ! jQuery.active++ )  // jQuery.event.trigger( "ajaxStart" );  // Matches an absolute URL, and saves the domain  //取url的 前面的信息 和 域名  var parts = /^(\w+:)?\/\/([^\/?#]+)/.exec( s.url );  if ( s.dataType == "script" && type == "GET" && parts  && ( parts[1] && parts[1] != location.protocol || parts[2] != location.host )){  var head = document.getElementsByTagName("head")[0];  var script = document.createElement("script");  script.src = s.url;  if (s.scriptCharset)  script.charset = s.scriptCharset;  //如果不是jsonp方式  就是创建一个script标签  if ( !jsonp ) {  //保证回调函数只执行一次  var done = false;  // Attach handlers for all browsers  兼容所有的浏览器的写法  script.onload = script.onreadystatechange = function(){  if ( !done && (!this.readyState ||  this.readyState == "loaded" || this.readyState == "complete") ) {  done = true;  //success();  //complete();  // Handle memory leak in IE  jq里面可以说反复的强调了 删除元素时 该dom元素引用的对象要断开引用  不然会内存泄露  script.onload = script.onreadystatechange = null;  head.removeChild( script );  }  };  }  head.appendChild(script);  // We handle everything using the script element injection  return undefined;  }  //用一个保证回掉函数只执行一次  var requestDone = false;  var xhr = s.xhr();  // Open the socket  // Passing null username, generates a login popup on Opera (#2865)  if( s.username )  xhr.open(type, s.url, s.async, s.username, s.password);  else  xhr.open(type, s.url, s.async);  try {  if ( s.data )  xhr.setRequestHeader("Content-Type", s.contentType);  // Set the If-Modified-Since header, if ifModified mode.  //If-Modified-Since 记录页面最后修改时间的 HTTP 头信息  // 会和服务器的时间比较  在这个时间内  返回的是304  if ( s.ifModified )  xhr.setRequestHeader("If-Modified-Since",  jq.lastModified[s.url] || "Thu, 01 Jan 1970 00:00:00 GMT" );  // Set header so the called script knows that it's an XMLHttpRequest  xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");  // Set the Accepts header for the server, depending on the dataType  xhr.setRequestHeader("Accept", s.dataType && s.accepts[ s.dataType ] ?  s.accepts[ s.dataType ] + ", */*" :  s.accepts._default );  } catch(e){}  //发送钱的回调  如果回调函数的返回是false abort掉  if ( s.beforeSend && s.beforeSend(xhr, s) === false ) {  xhr.abort();  return false;  }  var onreadystatechange = function(isTimeout){  // The request was aborted, clear the interval and decrement jQuery.active  if (xhr.readyState == 0) {  if (ival) {  // clear poll interval  clearInterval(ival);  ival = null;  }  // The transfer is complete and the data is available, or the request timed out  } else if ( !requestDone && xhr && (xhr.readyState == 4 || isTimeout == "timeout") ) {  //保证回调只执行一次  requestDone = true;  //清空掉定时器  if (ival) {  clearInterval(ival);  ival = null;  }  status = isTimeout == "timeout"  ? "timeout"  : !jq.httpSuccess( xhr )  ? "error"  : s.ifModified && jq.httpNotModified( xhr, s.url )  ? "notmodified"  : "success";  //判断是否已经超时  if ( status == "success" ) {  // Watch for, and catch, XML document parse errors  try {  // process the data (runs the xml through httpData regardless of callback)  data = jq.httpData( xhr, s.dataType, s );  } catch(e) {  status = "parsererror";  }  }  // Make sure that the request was successful or notmodified  if ( status == "success" ) {  // Cache Last-Modified header, if ifModified mode.  var modRes;  try {  modRes = xhr.getResponseHeader("Last-Modified");  } catch(e) {} // swallow exception thrown by FF if header is not available  //记录下最后请求的时间  因为之后再请求的话 还要继续和服务器的时间比较  if ( s.ifModified && modRes )  jq.lastModified[s.url] = modRes;  // JSONP handles its own success callback  if ( !jsonp )  success();  } else  jq.handleError(s, xhr, status);  // Fire the complete handlers  complete();  if ( isTimeout )  xhr.abort();  // Stop memory leaks  if ( s.async )  xhr = null;  }  };  if ( s.async ) {  // don't attach the handler to the request, just poll it instead  var ival = setInterval(</div>
    </div>
            
    <div class="art_new">
        <div class="m w1000">
            <div>相关阅读</div>
            <div>
                <ul>
                    
                    <li><a href="shownews.aspx?newid=8205" title="猜猜，谁从从科幻走进现实了？">·  猜猜，谁从从科幻走进现实了？2012.10.21</a></li>
                    
                    <li><a href="shownews.aspx?newid=7717" title="在网页设计中应用大照片作背景的52个优秀范例（上篇）">·  在网页设计中应用大照片作背景的52个优秀范例（上篇）2012.10.21</a></li>
                    
                    <li><a href="shownews.aspx?newid=7716" title="HTML特殊字符编码对照表">·  HTML特殊字符编码对照表2012.10.21</a></li>
                    
                    <li><a href="shownews.aspx?newid=7715" title="常见Web技术之间的关系，你了解多少？">·  常见Web技术之间的关系，你了解多少？2012.10.21</a></li>
                    
                    <li><a href="shownews.aspx?newid=7684" title="for(var key in object){}语句枚举">·  for(var key in object){}语句枚举2012.10.21</a></li>
                    
                </ul>
            </div>
        </div>
    </div>

<div class="foot_bot">
        <div class="fb_top">
            <div class="fb_QR">
                <span class="contact">联系我们<span class="contact_us">CONTACT</span></span>
                <img class="QRcode" src="../20190903image/index/QRcode.png" alt="">
                <span class="scanner">扫一扫</span>
            </div>
            <table class="fb_table" summary="基本信息及联系方式">
                <tr>
                    <td colspan="3">
                        <span class="provide">愿景：成为最专业的软件研发服务领航者</span>
                    </td>
                </tr>
                <tr>
                    <td>中睿信息技术有限公司 广州•深圳</td>
                    <td>Tel：020-38931912</td>
                    <td>务实 Pragmatic</td>
                </tr>
                <tr>
                    <td>广州：广州市天河区翰景路1号金星大厦18层中睿信息</td>
                    <td>Fax：020-38931912</td>
                    <td>专业 Professional</td>
                </tr>
                <tr>
                    <td>深圳：深圳市福田区车公庙有色金属大厦509~510</td>
                    <td>Tel：0755-25855012</td>
                    <td>诚信 Integrity</td>
                </tr>
                    <tr>
                        <td colspan="3">所有权声明：PMI, PMP, Project Management Professional, PMI-ACP, PMI-PBA和PMBOK是项目管理协会(Project Management Institute, Inc.)的注册标志。</td>
                    </tr>
            </table>
        </div>
        <div class="fb_but">
            <span>版权所有：广州中睿信息技术有限公司  粤ICP备13082838号-2</span>
        </div>
    </div>
</form>
</body>
</html>