AJax¼¼Êõ

[jsµã»÷]JavaScriptÖ®Ajax¼¼Êõ01

×ÖºÅ+ ×÷ÕߣºH5Ö®¼Ò À´Ô´£ºH5Ö®¼Ò 2017-10-18 17:03 ÎÒÒªÆÀÂÛ( )

AJAX ä¯ÀÀÆ÷Óë·þÎñÆ÷Ö®¼ä£¬²ÉÓÃHTTPЭÒéͨÐÅ¡£Óû§ÔÚä¯ÀÀÆ÷µØÖ·À¸¼üÈëÒ»¸öÍøÖ·£¬»òÕßͨ¹ýÍøÒ³±íµ¥Ïò·þÎñÆ÷Ìá½»ÄÚÈÝ£¬Õâʱä¯ÀÀÆ÷¾Í»áÏò·þÎñÆ÷·¢³öHTTPÇëÇó¡£1999

AJAX

ä¯ÀÀÆ÷Óë·þÎñÆ÷Ö®¼ä£¬²ÉÓÃHTTPЭÒéͨÐÅ¡£Óû§ÔÚä¯ÀÀÆ÷µØÖ·À¸¼üÈëÒ»¸öÍøÖ·£¬»òÕßͨ¹ýÍøÒ³±íµ¥Ïò·þÎñÆ÷Ìá½»ÄÚÈÝ£¬Õâʱä¯ÀÀÆ÷¾Í»áÏò·þÎñÆ÷·¢³öHTTPÇëÇó¡£

1999Ä꣬΢Èí¹«Ë¾·¢²¼IEä¯ÀÀÆ÷5.0°æ£¬µÚÒ»´ÎÒýÈëй¦ÄÜ£ºÔÊÐíJavaScript½Å±¾Ïò·þÎñÆ÷·¢ÆðHTTPÇëÇó¡£Õâ¸ö¹¦Äܵ±Ê±²¢Ã»ÓÐÒýÆð×¢Ò⣬ֱµ½2004ÄêGmail·¢²¼ºÍ2005ÄêGoogle Map·¢²¼£¬²ÅÒýÆð¹ã·ºÖØÊÓ¡£2005Äê2Ô£¬AJAXÕâ¸ö´ÊµÚÒ»´ÎÕýʽÌá³ö£¬Ö¸Î§ÈÆÕâ¸ö¹¦ÄܽøÐпª·¢µÄÒ»ÕûÌ××ö·¨¡£´Ó´Ë£¬AJAX³ÉΪ½Å±¾·¢ÆðHTTPͨÐŵĴúÃû´Ê£¬W3CÒ²ÔÚ2006Äê·¢²¼ÁËËüµÄ¹ú¼Ê±ê×¼¡£

¾ßÌåÀ´Ëµ£¬AJAX°üÀ¨ÒÔϼ¸¸ö²½Öè¡£

¸ÅÀ¨ÆðÀ´£¬¾ÍÊÇÒ»¾ä»°£¬AJAXͨ¹ýÔ­ÉúµÄXMLHttpRequest¶ÔÏó·¢³öHTTPÇëÇ󣬵õ½·þÎñÆ÷·µ»ØµÄÊý¾Ýºó£¬ÔÙ½øÐд¦Àí¡£

AJAX¿ÉÒÔÊÇͬ²½ÇëÇó£¬Ò²¿ÉÒÔÊÇÒì²½ÇëÇó¡£µ«ÊÇ£¬´ó¶àÊýÇé¿öÏ£¬ÌØÖ¸Òì²½ÇëÇó¡£ÒòΪͬ²½µÄAjaxÇëÇ󣬶Ôä¯ÀÀÆ÷ÓС°¶ÂÈûЧӦ¡±¡£

XMLHttpRequest¶ÔÏó

XMLHttpRequest¶ÔÏóÓÃÀ´ÔÚä¯ÀÀÆ÷Óë·þÎñÆ÷Ö®¼ä´«ËÍÊý¾Ý¡£

ÉÏÃæ´úÂëÏòÖ¸¶¨µÄ·þÎñÆ÷ÍøÖ·£¬·¢³öGETÇëÇó¡£

È»ºó£¬AJAXÖ¸¶¨»Øµ÷º¯Êý£¬¼àÌýͨÐÅ״̬£¨readyStateÊôÐÔ£©µÄ±ä»¯¡£

Ò»µ©Äõ½·þÎñÆ÷·µ»ØµÄÊý¾Ý£¬AJAX²»»áË¢ÐÂÕû¸öÍøÒ³£¬¶øÊÇÖ»¸üÐÂÏà¹Ø²¿·Ö£¬´Ó¶ø²»´ò¶ÏÓû§ÕýÔÚ×öµÄÊÂÇé¡£

×¢Ò⣬AJAXÖ»ÄÜÏòͬԴÍøÖ·£¨Ð­Òé¡¢ÓòÃû¡¢¶Ë¿Ú¶¼Ïàͬ£©·¢³öHTTPÇëÇó£¬Èç¹û·¢³ö¿çÔ´ÇëÇ󣬾ͻᱨ´í£¨Ïê¼û¡¶Í¬Ô´Õþ²ß¡·ºÍ¡¶CORS»úÖÆ¡·Á½½Ú£©¡£

ËäÈ»Ãû×ÖÀïÃæÓÐXML£¬µ«ÊÇʵ¼ÊÉÏ£¬XMLHttpRequest¿ÉÒÔ±¨Ë͸÷ÖÖÊý¾Ý£¬°üÀ¨×Ö·û´®ºÍ¶þ½øÖÆ£¬¶øÇÒ³ýÁËHTTP£¬Ëü»¹Ö§³Öͨ¹ýÆäËûЭÒé´«ËÍ£¨±ÈÈçFileºÍFTP£©¡£

ÏÂÃæÊÇXMLHttpRequest¶ÔÏóµÄµäÐÍÓ÷¨¡£

open·½·¨µÄµÚÈý¸ö²ÎÊýÊÇÒ»¸ö²¼¶ûÖµ£¬±íʾÊÇ·ñΪÒì²½ÇëÇó¡£Èç¹ûÉèΪfalse£¬¾Í±íʾÕâ¸öÇëÇóÊÇͬ²½µÄ£¬ÏÂÃæÊÇÒ»¸öÀý×Ó¡£

XMLHttpRequestʵÀýµÄÊôÐÔ readyState

readyStateÊÇÒ»¸öÖ»¶ÁÊôÐÔ£¬ÓÃÒ»¸öÕûÊýºÍ¶ÔÓ¦µÄ³£Á¿£¬±íʾXMLHttpRequestÇëÇóµ±Ç°Ëù´¦µÄ״̬¡£

ÔÚͨÐŹý³ÌÖУ¬Ã¿µ±·¢Éú״̬±ä»¯µÄʱºò£¬readyStateÊôÐÔµÄÖµ¾Í»á·¢Éú¸Ä±ä¡£Õâ¸öֵÿһ´Î±ä»¯£¬¶¼»á´¥·¢readyStateChangeʼþ¡£

ÉÏÃæ´úÂë±íʾ£¬Ö»ÓÐreadyState±äΪ4ʱ£¬²ÅËãÈ·ÈÏÇëÇóÒѾ­³É¹¦£¬ÆäËûÖµ¶¼±íʾÇëÇó»¹ÔÚ½øÐÐÖС£

onreadystatechange

onreadystatechangeÊôÐÔÖ¸ÏòÒ»¸ö»Øµ÷º¯Êý£¬µ±readystatechangeʼþ·¢ÉúµÄʱºò£¬Õâ¸ö»Øµ÷º¯Êý¾Í»áµ÷Ó㬲¢ÇÒXMLHttpRequestʵÀýµÄreadyStateÊôÐÔÒ²»á·¢Éú±ä»¯¡£

ÁíÍ⣬Èç¹ûʹÓÃabort()·½·¨£¬ÖÕÖ¹XMLHttpRequestÇëÇó£¬onreadystatechange»Øµ÷º¯ÊýÒ²»á±»µ÷Óá£

response

responseÊôÐÔΪֻ¶Á£¬·µ»Ø½ÓÊÕµ½µÄÊý¾ÝÌ壨¼´body²¿·Ö£©¡£ËüµÄÀàÐÍ¿ÉÒÔÊÇArrayBuffer¡¢Blob¡¢Document¡¢JSON¶ÔÏó¡¢»òÕßÒ»¸ö×Ö·û´®£¬ÕâÓÉXMLHttpRequest.responseTypeÊôÐÔµÄÖµ¾ö¶¨¡£

Èç¹û±¾´ÎÇëÇóûÓгɹ¦»òÕßÊý¾Ý²»ÍêÕû£¬¸ÃÊôÐԾͻáµÈÓÚnull¡£

responseType

responseTypeÊôÐÔÓÃÀ´Ö¸¶¨·þÎñÆ÷·µ»ØÊý¾Ý£¨xhr.response£©µÄÀàÐÍ¡£

textÀàÐÍÊʺϴó¶àÊýÇé¿ö£¬¶øÇÒÖ±½Ó´¦ÀíÎı¾Ò²±È½Ï·½±ã£¬documentÀàÐÍÊʺϷµ»ØXMLÎĵµµÄÇé¿ö£¬blobÀàÐÍÊʺ϶ÁÈ¡¶þ½øÖÆÊý¾Ý£¬±ÈÈçͼƬÎļþ¡£

Èç¹û½«Õâ¸öÊôÐÔÉèΪArrayBuffer£¬¾Í¿ÉÒÔ°´ÕÕÊý×éµÄ·½Ê½´¦Àí¶þ½øÖÆÊý¾Ý¡£

Èç¹û½«Õâ¸öÊôÐÔÉèΪ¡°json¡±£¬Ö§³ÖJSONµÄä¯ÀÀÆ÷£¨Firefox>9£¬chrome>30£©£¬¾Í»á×Ô¶¯¶Ô·µ»ØÊý¾Ýµ÷ÓÃJSON.parse()·½·¨¡£Ò²¾ÍÊÇ˵£¬Äã´Óxhr.responseÊôÐÔ£¨×¢Ò⣬²»ÊÇxhr.responseTextÊôÐÔ£©µÃµ½µÄ²»ÊÇÎı¾£¬¶øÊÇÒ»¸öJSON¶ÔÏó¡£

XHR2Ö§³ÖAjaxµÄ·µ»ØÀàÐÍΪÎĵµ£¬¼´xhr.responseType=¡±document¡± ¡£ÕâÒâζ×Å£¬¶ÔÓÚÄÇЩ´ò¿ªCORSµÄÍøÕ¾£¬ÎÒÃÇ¿ÉÒÔÖ±½ÓÓÃAjaxץȡÍøÒ³£¬È»ºó²»ÓýâÎöHTML×Ö·û´®£¬Ö±½Ó¶ÔXHR»ØÓ¦½øÐÐDOM²Ù×÷¡£

responseText

responseTextÊôÐÔ·µ»Ø´Ó·þÎñÆ÷½ÓÊÕµ½µÄ×Ö·û´®£¬¸ÃÊôÐÔΪֻ¶Á¡£Èç¹û±¾´ÎÇëÇóûÓгɹ¦»òÕßÊý¾Ý²»ÍêÕû£¬¸ÃÊôÐԾͻáµÈÓÚnull¡£

Èç¹û·þÎñÆ÷·µ»ØµÄÊý¾Ý¸ñʽÊÇJSON£¬¾Í¿ÉÒÔʹÓÃresponseTextÊôÐÔ¡£

responseXML

responseXMLÊôÐÔ·µ»Ø´Ó·þÎñÆ÷½ÓÊÕµ½µÄDocument¶ÔÏ󣬸ÃÊôÐÔΪֻ¶Á¡£Èç¹û±¾´ÎÇëÇóûÓгɹ¦£¬»òÕßÊý¾Ý²»ÍêÕû£¬»òÕß²»Äܱ»½âÎöΪXML»òHTML£¬¸ÃÊôÐÔµÈÓÚnull¡£

·µ»ØµÄÊý¾Ý»á±»Ö±½Ó½âÎöΪDOM¶ÔÏó¡£

Èç¹û·þÎñÆ÷·µ»ØµÄÊý¾Ý£¬Ã»ÓÐÃ÷ʾContent-TypeÍ·ÐÅÏ¢µÈÓÚtext/xml£¬¿ÉÒÔʹÓÃoverrideMimeType()·½·¨£¬Ö¸¶¨XMLHttpRequest¶ÔÏ󽫷µ»ØµÄÊý¾Ý½âÎöΪXML¡£

status

statusÊôÐÔΪֻ¶ÁÊôÐÔ£¬±íʾ±¾´ÎÇëÇóËùµÃµ½µÄHTTP״̬Â룬ËüÊÇÒ»¸öÕûÊý¡£Ò»°ãÀ´Ëµ£¬Èç¹ûͨÐųɹ¦µÄ»°£¬Õâ¸ö״̬ÂëÊÇ200¡£

»ù±¾ÉÏ£¬Ö»ÓÐ2xxºÍ304µÄ״̬Â룬±íʾ·þÎñÆ÷·µ»ØÊÇÕý³£×´Ì¬¡£

statusText

statusTextÊôÐÔΪֻ¶ÁÊôÐÔ£¬·µ»ØÒ»¸ö×Ö·û´®£¬±íʾ·þÎñÆ÷·¢Ë͵Ä״̬Ìáʾ¡£²»Í¬ÓÚstatusÊôÐÔ£¬¸ÃÊôÐÔ°üº¬Õû¸ö״̬ÐÅÏ¢£¬±ÈÈ硱200 OK¡°¡£

timeout

timeoutÊôÐÔµÈÓÚÒ»¸öÕûÊý£¬±íʾ¶àÉÙºÁÃëºó£¬Èç¹ûÇëÇóÈÔȻûÓеõ½½á¹û£¬¾Í»á×Ô¶¯ÖÕÖ¹¡£Èç¹û¸ÃÊôÐÔµÈÓÚ0£¬¾Í±íʾûÓÐʱ¼äÏÞÖÆ¡£

[jsµã»÷]JavaScriptÖ®AJAX¼¼Êõ02

¡¡

1.±¾Õ¾×ñÑ­ÐÐÒµ¹æ·¶£¬ÈκÎתÔصĸå¼þ¶¼»áÃ÷È·±ê×¢×÷ÕߺÍÀ´Ô´£»2.±¾Õ¾µÄÔ­´´ÎÄÕ£¬ÇëתÔØʱÎñ±Ø×¢Ã÷ÎÄÕÂ×÷ÕߺÍÀ´Ô´£¬²»×ðÖØÔ­´´µÄÐÐΪÎÒÃǽ«×·¾¿ÔðÈΣ»3.×÷ÕßͶ¸å¿ÉÄܻᾭÎÒÃDZ༭Ð޸Ļò²¹³ä¡£

Ïà¹ØÎÄÕÂ
  • ʹÓ÷´ÏòAjax¼¼Êõ×öÔÚÏß¿Í·þϵͳ

    ʹÓ÷´ÏòAjax¼¼Êõ×öÔÚÏß¿Í·þϵͳ

    2017-08-23 18:00

ÍøÓѵãÆÀ
ó