text: import{_ as a,c as t,o as e,a as n,b as s}from"./app.af8564e9.js";var o="/ajaxCourse/assets/02.fa72c6b3.png",c="/ajaxCourse/assets/image-20210408203843616.7100269a.png",l="/ajaxCourse/assets/image-20210408210449618.cf67a53e.png",p="/ajaxCourse/assets/image-20210408212553767.94c0969c.png",u="/ajaxCourse/assets/image-20210409195706494.e28edf96.png",i="/ajaxCourse/assets/image-20210409200447866.f7af820c.png",r="/ajaxCourse/assets/image-20210409200853957.298f04e6.png",k="/ajaxCourse/assets/image-20210409201752214.f6a75e16.png",b="/ajaxCourse/assets/image-20210409202257820.d70f443b.png",m="/ajaxCourse/assets/image-20210409205248730.8d5c117e.png",d="/ajaxCourse/assets/image-20210409211325423.ba6d654d.png",h="/ajaxCourse/assets/image-20210409211821294.d4adaee7.png",g="/ajaxCourse/assets/image-20210409212247774.18136cca.png",f="/ajaxCourse/assets/image-20210409213657063.e7cc3b21.png",_="/ajaxCourse/assets/image-20210409213735355.76ef2263.png",v="/ajaxCourse/assets/image-20210414114934520.428dbbdd.png",w="/ajaxCourse/assets/image-20210419111628466.887aff8f.png",x="/ajaxCourse/assets/image-20210419115013142.31d12148.png",y="/ajaxCourse/assets/image-20210419115142833.8f67761a.png",j="/ajaxCourse/assets/image-20210419173652501.203d0bdd.png",q="/ajaxCourse/assets/image-20210419174149422.72785831.png",S="/ajaxCourse/assets/image-20210419174328879.8eae1b72.png",T="/ajaxCourse/assets/image-20210419174515580.6133ba2b.png";const Te='{"title":"\u7B2C\u4E03\u7AE0\uFF1Aajax","description":"","frontmatter":{},"headers":[{"level":2,"title":"Ajax \u4ECB\u7ECD","slug":"ajax-\u4ECB\u7ECD"},{"level":3,"title":"\u5E94\u7528\u573A\u666F","slug":"\u5E94\u7528\u573A\u666F"},{"level":3,"title":"\u8FD0\u884C\u73AF\u5883","slug":"\u8FD0\u884C\u73AF\u5883"},{"level":3,"title":"Ajax \u8FD0\u884C\u539F\u7406\u53CA\u5B9E\u73B0","slug":"ajax-\u8FD0\u884C\u539F\u7406\u53CA\u5B9E\u73B0"},{"level":2,"title":"\u670D\u52A1\u5668\u5BA2\u6237\u7AEF\u4E0E\u7F51\u7EDC \u901A\u4FE1\u534F\u8BAE","slug":"\u670D\u52A1\u5668\u5BA2\u6237\u7AEF\u4E0E\u7F51\u7EDC-\u901A\u4FE1\u534F\u8BAE"},{"level":3,"title":"\u670D\u52A1\u5668\u4E0E\u5BA2\u6237\u7AEF","slug":"\u670D\u52A1\u5668\u4E0E\u5BA2\u6237\u7AEF"},{"level":3,"title":"\u7F51\u7EDC\uFF1AIP \u57DF\u540D","slug":"\u7F51\u7EDC\uFF1Aip-\u57DF\u540D"},{"level":3,"title":"\u57DF\u540D\u89E3\u6790\u670D\u52A1\u5668\uFF1ADNS","slug":"\u57DF\u540D\u89E3\u6790\u670D\u52A1\u5668\uFF1Adns"},{"level":3,"title":"\u7AEF\u53E3","slug":"\u7AEF\u53E3"},{"level":3,"title":"\u901A\u4FE1\u534F\u8BAE","slug":"\u901A\u4FE1\u534F\u8BAE"},{"level":2,"title":"Wamp \u7684\u5B89\u88C5\u548C\u914D\u7F6E","slug":"wamp-\u7684\u5B89\u88C5\u548C\u914D\u7F6E"},{"level":3,"title":"\u670D\u52A1\u5B89\u88C5","slug":"\u670D\u52A1\u5B89\u88C5"},{"level":3,"title":"\u914D\u7F6E\u6587\u4EF6","slug":"\u914D\u7F6E\u6587\u4EF6"},{"level":3,"title":"\u865A\u62DF\u4E3B\u673A\u914D\u7F6E","slug":"\u865A\u62DF\u4E3B\u673A\u914D\u7F6E"},{"level":2,"title":"GET \u548C POST \u8BF7\u6C42","slug":"get-\u548C-post-\u8BF7\u6C42"},{"level":3,"title":"GET \u8BF7\u6C42","slug":"get-\u8BF7\u6C42"},{"level":3,"title":"POST \u8BF7\u6C42","slug":"post-\u8BF7\u6C42"},{"level":3,"title":"\u5176\u4ED6\u8BF7\u6C42","slug":"\u5176\u4ED6\u8BF7\u6C42"},{"level":2,"title":"jQuery \u4E2D\u5C01\u88C5\u7684 Ajax \u76F8\u5173\u65B9\u6CD5","slug":"jquery-\u4E2D\u5C01\u88C5\u7684-ajax-\u76F8\u5173\u65B9\u6CD5"},{"level":3,"title":"$.get() \u65B9\u6CD5","slug":"get-\u65B9\u6CD5"},{"level":3,"title":"$.post \u65B9\u6CD5","slug":"post-\u65B9\u6CD5"},{"level":3,"title":"$.ajax \u65B9\u6CD5","slug":"ajax-\u65B9\u6CD5"},{"level":2,"title":"\u63A5\u53E3\u53CA\u63A5\u53E3\u6587\u6863","slug":"\u63A5\u53E3\u53CA\u63A5\u53E3\u6587\u6863"},{"level":3,"title":"\u63A5\u53E3","slug":"\u63A5\u53E3"},{"level":3,"title":"\u63A5\u53E3\u6587\u6863","slug":"\u63A5\u53E3\u6587\u6863"},{"level":2,"title":"Network \u63A7\u5236\u53F0","slug":"network-\u63A7\u5236\u53F0"},{"level":2,"title":"XMLHttpRequest \u5BF9\u8C61","slug":"xmlhttprequest-\u5BF9\u8C61"},{"level":3,"title":"\u539F\u751F Js \u5B9E\u73B0\u57FA\u672C\u7684 GET \u8BF7\u6C42","slug":"\u539F\u751F-js-\u5B9E\u73B0\u57FA\u672C\u7684-get-\u8BF7\u6C42"},{"level":3,"title":"\u539F\u751F Js \u5B9E\u73B0\u57FA\u672C\u7684 POST \u8BF7\u6C42","slug":"\u539F\u751F-js-\u5B9E\u73B0\u57FA\u672C\u7684-post-\u8BF7\u6C42"},{"level":2,"title":"\u539F\u751F Js \u8FDB\u884C\u5C01\u88C5","slug":"\u539F\u751F-js-\u8FDB\u884C\u5C01\u88C5"},{"level":3,"title":"readyState \u5C5E\u6027","slug":"readystate-\u5C5E\u6027"},{"level":2,"title":"status \u5C5E\u6027","slug":"status-\u5C5E\u6027"},{"level":2,"title":"URL \u7F16\u7801\u89E3\u7801","slug":"url-\u7F16\u7801\u89E3\u7801"},{"level":3,"title":"\u7F16\u7801","slug":"\u7F16\u7801"},{"level":3,"title":"\u89E3\u7801","slug":"\u89E3\u7801"},{"level":2,"title":"XMLHttpRequest level 2","slug":"xmlhttprequest-level-2"},{"level":3,"title":"timeout \u8BF7\u6C42\u8D85\u65F6\u9650\u5236\u8BBE\u7F6E","slug":"timeout-\u8BF7\u6C42\u8D85\u65F6\u9650\u5236\u8BBE\u7F6E"},{"level":3,"title":"onload \u4E8B\u4EF6","slug":"onload-\u4E8B\u4EF6"},{"level":3,"title":"onerror \u4E8B\u4EF6","slug":"onerror-\u4E8B\u4EF6"},{"level":3,"title":"onprogress \u4E8B\u4EF6","slug":"onprogress-\u4E8B\u4EF6"},{"level":3,"title":"onloadstart \u4E8B\u4EF6","slug":"onloadstart-\u4E8B\u4EF6"},{"level":3,"title":"onloadend \u4E8B\u4EF6","slug":"onloadend-\u4E8B\u4EF6"},{"level":2,"title":"FormData \u5BF9\u8C61","slug":"formdata-\u5BF9\u8C61"},{"level":3,"title":"API \u65B9\u6CD5","slug":"api-\u65B9\u6CD5"},{"level":2,"title":"\u6587\u4EF6\u4E0A\u4F20\u8FDB\u5EA6\u76D1\u542C","slug":"\u6587\u4EF6\u4E0A\u4F20\u8FDB\u5EA6\u76D1\u542C"},{"level":2,"title":"CORS \u8DE8\u57DF\u8D44\u6E90\u5171\u4EAB","slug":"cors-\u8DE8\u57DF\u8D44\u6E90\u5171\u4EAB"},{"level":2,"title":"JSON","slug":"json"},{"level":3,"title":"JSON\u5B57\u7B26\u4E32\u548CJS\u6570\u636E\u8F6C\u6362","slug":"json\u5B57\u7B26\u4E32\u548Cjs\u6570\u636E\u8F6C\u6362"},{"level":2,"title":"\u57FA\u4E8E HTTP \u5E93 \u7684\u63A5\u53E3\uFF08Mock.js\u3001Fetch\u3001axios\uFF09","slug":"\u57FA\u4E8E-http-\u5E93-\u7684\u63A5\u53E3\uFF08mock-js\u3001fetch\u3001axios\uFF09"},{"level":3,"title":"Mock.js \u63A5\u53E3","slug":"mock-js-\u63A5\u53E3"},{"level":3,"title":"Fetch \u63A5\u53E3","slug":"fetch-\u63A5\u53E3"},{"level":3,"title":"axios \u63A5\u53E3\uFF08\u63A8\u8350\uFF09","slug":"axios-\u63A5\u53E3\uFF08\u63A8\u8350\uFF09"},{"level":2,"title":"art-template \u6A21\u677F","slug":"art-template-\u6A21\u677F"},{"level":3,"title":"art-template \u5FAA\u73AF\u8BED\u6CD5","slug":"art-template-\u5FAA\u73AF\u8BED\u6CD5"},{"level":3,"title":"\u6CE8\u610F\u4E8B\u9879","slug":"\u6CE8\u610F\u4E8B\u9879"},{"level":3,"title":"art \u6E32\u67D3\u5217\u8868","slug":"art-\u6E32\u67D3\u5217\u8868"},{"level":2,"title":"\u6848\u4F8B\uFF1A\u4E8C\u8FDB\u5236\u6587\u4EF6\u4E0A\u4F20","slug":"\u6848\u4F8B\uFF1A\u4E8C\u8FDB\u5236\u6587\u4EF6\u4E0A\u4F20"}],"relativePath":"documents/ajax/ajax.md","lastUpdated":1636113717869}',D={},N=n("h1",{id:"\u7B2C\u4E03\u7AE0\uFF1Aajax",tabindex:"-1"},[s("\u7B2C\u4E03\u7AE0\uFF1Aajax "),n("a",{class:"header-anchor",href:"#\u7B2C\u4E03\u7AE0\uFF1Aajax","aria-hidden":"true"},"#")],-1),L=n("h2",{id:"ajax-\u4ECB\u7ECD",tabindex:"-1"},[s("Ajax \u4ECB\u7ECD "),n("a",{class:"header-anchor",href:"#ajax-\u4ECB\u7ECD","aria-hidden":"true"},"#")],-1),O=n("blockquote",null,[n("p",null,"\u5168\u79F0\uFF1AAsynchronous Javascript And XML"),n("p",null,[s("\u4F5C\u7528\uFF1A"),n("strong",null,"\u83B7\u53D6\u670D\u52A1\u5668\u7684\u6570\u636E")])],-1),J=n("h3",{id:"\u5E94\u7528\u573A\u666F",tabindex:"-1"},[s("\u5E94\u7528\u573A\u666F "),n("a",{class:"header-anchor",href:"#\u5E94\u7528\u573A\u666F","aria-hidden":"true"},"#")],-1),E=n("ol",null,[n("li",null,"\u9875\u9762\u4E0A\u62C9\u52A0\u8F7D\u66F4\u591A\u6570\u636E"),n("li",null,"\u5217\u8868\u6570\u636E\u65E0\u5237\u65B0\u5206\u9875"),n("li",null,"\u8868\u5355\u9879\u79BB\u5F00\u7126\u70B9\u6570\u636E\u9A8C\u8BC1"),n("li",null,"\u641C\u7D22\u6846\u63D0\u793A\u6587\u5B57\u4E0B\u62C9\u5217\u8868")],-1),P=n("h3",{id:"\u8FD0\u884C\u73AF\u5883",tabindex:"-1"},[s("\u8FD0\u884C\u73AF\u5883 "),n("a",{class:"header-anchor",href:"#\u8FD0\u884C\u73AF\u5883","aria-hidden":"true"},"#")],-1),C=n("blockquote",null,[n("p",null,"Ajax\u6280\u672F\u9700\u8981\u8FD0\u884C\u5728\u7F51\u7AD9\u73AF\u5883\u4E2D\u624D\u80FD\u751F\u6548\uFF0C\u5F53\u524D\u8BFE\u7A0B\u4F1A\u4F7F\u7528 Node \u521B\u5EFA\u7684\u670D\u52A1\u5668\u4F5C\u4E3A\u7F51\u7AD9\u670D\u52A1\u5668\u3002")],-1),H=n("p",null,"==\u603B\u7ED3\uFF1A\u5C40\u90E8\u3001\u5F02\u6B65\u5237\u65B0== \uFF08\u5F02\u6B65\u4E0D\u963B\u585E\u3001\u9875\u9762\u65E0\u5237\u65B0\u901A\u4FE1\uFF09",-1),M=n("h3",{id:"ajax-\u8FD0\u884C\u539F\u7406\u53CA\u5B9E\u73B0",tabindex:"-1"},[s("Ajax \u8FD0\u884C\u539F\u7406\u53CA\u5B9E\u73B0 "),n("a",{class:"header-anchor",href:"#ajax-\u8FD0\u884C\u539F\u7406\u53CA\u5B9E\u73B0","aria-hidden":"true"},"#")],-1),R=n("p",null,[n("strong",null,"\u8FD0\u884C\u539F\u7406\uFF1AAjax \u76F8\u5F53\u4E8E\u6D4F\u89C8\u5668\u53D1\u9001\u8BF7\u6C42\u4E0E\u63A5\u6536\u54CD\u5E94\u7684\u4EE3\u7406\u4EBA"),s("\uFF0C\u4EE5\u5B9E\u73B0\u5728\u4E0D\u5F71\u54CD\u7528\u6237\u6D4F\u89C8\u9875\u9762\u7684\u60C5\u51B5\u4E0B\uFF0C"),n("strong",null,"\u5C40\u90E8\u66F4\u65B0\u9875\u9762\u6570\u636E"),s("\uFF0C\u4ECE\u800C\u63D0\u9AD8\u7528\u6237\u4F53\u9A8C\u3002")],-1),A=n("h2",{id:"\u670D\u52A1\u5668\u5BA2\u6237\u7AEF\u4E0E\u7F51\u7EDC-\u901A\u4FE1\u534F\u8BAE",tabindex:"-1"},[s("\u670D\u52A1\u5668\u5BA2\u6237\u7AEF\u4E0E\u7F51\u7EDC \u901A\u4FE1\u534F\u8BAE "),n("a",{class:"header-anchor",href:"#\u670D\u52A1\u5668\u5BA2\u6237\u7AEF\u4E0E\u7F51\u7EDC-\u901A\u4FE1\u534F\u8BAE","aria-hidden":"true"},"#")],-1),$=n("h3",{id:"\u670D\u52A1\u5668\u4E0E\u5BA2\u6237\u7AEF",tabindex:"-1"},[s("\u670D\u52A1\u5668\u4E0E\u5BA2\u6237\u7AEF "),n("a",{class:"header-anchor",href:"#\u670D\u52A1\u5668\u4E0E\u5BA2\u6237\u7AEF","aria-hidden":"true"},"#")],-1),X=n("p",null,"\u670D\u52A1\u5668\uFF1A\u80FD\u591F\u63D0\u4F9B\u67D0\u79CD\u670D\u52A1\u7684\u7535\u8111",-1),I=n("p",null,"\u5BA2\u6237\u7AEF\uFF1A\u60F3\u4F7F\u7528\u670D\u52A1\u5668\u6240\u63D0\u4F9B\u670D\u52A1\u7684\u7535\u8111",-1),F=n("p",null,[n("img",{src:o,alt:"02"})],-1),U=n("h3",{id:"\u7F51\u7EDC\uFF1Aip-\u57DF\u540D",tabindex:"-1"},[s("\u7F51\u7EDC\uFF1AIP \u57DF\u540D "),n("a",{class:"header-anchor",href:"#\u7F51\u7EDC\uFF1Aip-\u57DF\u540D","aria-hidden":"true"},"#")],-1),G=n("p",null,[n("strong",null,"IP \u5730\u5740\uFF1A"),s(" \u5728\u7F51\u7EDC\u4E2D\u662F\u552F\u4E00\u7684\u6807\u8BC6\uFF0C"),n("strong",null,"\u901A\u8FC7IP \u5730\u5740\uFF0C\u80FD\u627E\u5230\u7279\u5B9A\u7684\u670D\u52A1\u5668\u3002")],-1),B=n("blockquote",null,[n("p",null,"\u6BD4\u5982\uFF1A\u767E\u5EA6\u670D\u52A1\u5668\u7684 IP \u5730\u5740\u4E3A\uFF1A180.101.49.12")],-1),z=n("p",null,[n("strong",null,"\u57DF\u540D\uFF1A"),s(" \u76F8\u5BF9\u4E8E IP \u5730\u5740\u6765\u8BB2\uFF0C\u66F4\u65B9\u4FBF\u8BB0\u5FC6\u3002")],-1),W=n("blockquote",null,[n("p",null,[s("\u6BD4\u5982\uFF1A\u767E\u5EA6\u57DF\u540D\uFF1A"),n("a",{href:"http://www.baidu.com",target:"_blank",rel:"noopener noreferrer"},"www.baidu.com")])],-1),Q=n("div",{class:"language-cmd line-numbers-mode"},[n("pre",null,[n("code",null,`\u67E5\u770B\u672C\u673AIP\u5730\u5740\uFF1A
  C:\\Users\\Admin> ipconfig
  `)]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br")])],-1),V=n("p",null,"\u67E5\u627E\u57DF\u540D\u5BF9\u5E94\u7684 IP \u5730\u5740\uFF08\u5916\u7F51\u5730\u5740\uFF09",-1),K=n("p",null,[n("img",{src:c,alt:"image-20210408203843616"})],-1),Y=n("h3",{id:"\u57DF\u540D\u89E3\u6790\u670D\u52A1\u5668\uFF1Adns",tabindex:"-1"},[s("\u57DF\u540D\u89E3\u6790\u670D\u52A1\u5668\uFF1ADNS "),n("a",{class:"header-anchor",href:"#\u57DF\u540D\u89E3\u6790\u670D\u52A1\u5668\uFF1Adns","aria-hidden":"true"},"#")],-1),Z=n("blockquote",null,[n("p",null,"\u57DF\u540D \u901A\u8FC7 DNS\uFF0C\u627E\u5230\u5BF9\u5E94\u7684 IP \u5730\u5740")],-1),nn=n("p",null,[n("strong",null,"DNS \u63D0\u4F9B\u4E86 \u57DF\u540D \u4E0E IP \u5730\u5740\u4E4B\u95F4\u7684\u6620\u5C04\u5173\u7CFB"),s("\u3002")],-1),sn=n("p",null,"\u8BBF\u95EE\u670D\u52A1\u5668\u7684\u6D41\u7A0B\uFF1A\u672C\u673A hosts \u6587\u4EF6 ==> DNS \u670D\u52A1\u5668 ==> \u670D\u52A1\u5668",-1),an=n("p",null,[n("img",{src:l,alt:"image-20210408210449618"})],-1),tn=n("h3",{id:"\u7AEF\u53E3",tabindex:"-1"},[s("\u7AEF\u53E3 "),n("a",{class:"header-anchor",href:"#\u7AEF\u53E3","aria-hidden":"true"},"#")],-1),en=n("p",null,[n("strong",null,"IP \u662F\u7528\u6765\u67E5\u627E\u67D0\u4E00\u53F0\u670D\u52A1\u5668\u7684"),s("\uFF0C\u4F46\u662F\u4E00\u53F0\u670D\u52A1\u5668\u53EF\u80FD\u63D0\u4F9B\u5F88\u591A\u79CD\u670D\u52A1\uFF0C\u6211\u4EEC\u627E\u5230\u8FD9\u53F0\u670D\u52A1\u5668\u65F6\uFF0C"),n("strong",null,"\u53EF\u4EE5\u4F7F\u7528\u7AEF\u53E3\u6765\u8BBF\u95EE\u5BF9\u5E94\u7684\u670D\u52A1"),s("\u3002")],-1),on=n("div",{class:"language-http line-numbers-mode"},[n("pre",null,[n("code",null,`\u7F51\u7AD9\u9ED8\u8BA4\u7AEF\u53E3\uFF1A80
  180.101.49.12:80
  \u6570\u636E\u5E93\u9ED8\u8BA4\u7AEF\u53E3\uFF1A3306
  180.101.49.12:3306
  `)]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br")])],-1),cn=n("h3",{id:"\u901A\u4FE1\u534F\u8BAE",tabindex:"-1"},[s("\u901A\u4FE1\u534F\u8BAE "),n("a",{class:"header-anchor",href:"#\u901A\u4FE1\u534F\u8BAE","aria-hidden":"true"},"#")],-1),ln=n("blockquote",null,[n("p",null,"\u901A\u4FE1\u534F\u8BAE\u5C31\u662F\u8BA1\u7B97\u673A\u4EA4\u6D41\u65F6\uFF0C\u4E8B\u5148\u89C4\u5B9A\u597D\u7684\u89C4\u5219\u3002")],-1),pn=n("p",null,[n("strong",null,"\u5E38\u89C1\u7684\u534F\u8BAE\uFF1A")],-1),un=n("ol",null,[n("li",null,[n("p",null,"HTTP\u3001HTTPS \u8D85\u6587\u672C\u4F20\u8F93\u534F\u8BAE"),n("ul",null,[n("li",null,"HTTP \u534F\u8BAE \u5E38\u7528\uFF1A\u8BF7\u6C42\u5934\u3001\u8BF7\u6C42\u4F53\u3001\u54CD\u5E94\u5934\u3001\u54CD\u5E94\u4F53")])]),n("li",null,[n("p",null,"FTP \u6587\u672C\u4F20\u8F93\u534F\u8BAE")]),n("li",null,[n("p",null,"SMTP \u7B80\u5355\u90AE\u4EF6\u4F20\u8F93\u534F\u8BAE"),n("p",null,"==\u6BCF\u4E2A\u534F\u8BAE\u90FD\u662F\u7EA6\u5B9A\u7684\u4E00\u4E9B\u89C4\u8303\uFF0C\u6CA1\u5FC5\u8981\u6DF1\u7A76\u3002==")])],-1),rn=n("p",null,[n("img",{src:p,alt:"image-20210408212553767"})],-1),kn=n("p",null,"^@\u90AE\u4EF6\u534F\u8BAE\u793A\u4F8B^",-1),bn=n("h2",{id:"wamp-\u7684\u5B89\u88C5\u548C\u914D\u7F6E",tabindex:"-1"},[s("Wamp \u7684\u5B89\u88C5\u548C\u914D\u7F6E "),n("a",{class:"header-anchor",href:"#wamp-\u7684\u5B89\u88C5\u548C\u914D\u7F6E","aria-hidden":"true"},"#")],-1),mn=n("blockquote",null,[n("p",null,"Wamp \u662F windows\u3001apache\u3001mysql\u3001php \u51E0\u4E2A\u670D\u52A1\u5668\u8F6F\u4EF6\u7684\u7F29\u5199\u3002"),n("p",null,"\u4F5C\u7528\uFF1A\u76F8\u5F53\u4E8E\u4E00\u53F0\u672C\u5730\u670D\u52A1\u5668\uFF0C\u53EF\u4EE5\u5728\u5C40\u57DF\u7F51\u5185\u901A\u8FC7 IP \u5730\u5740\u8FDB\u884C\u8BBF\u95EE")],-1),dn=n("h3",{id:"\u670D\u52A1\u5B89\u88C5",tabindex:"-1"},[s("\u670D\u52A1\u5B89\u88C5 "),n("a",{class:"header-anchor",href:"#\u670D\u52A1\u5B89\u88C5","aria-hidden":"true"},"#")],-1),hn=n("p",null,[s("\u901A\u8FC7 "),n("a",{href:"https://sourceforge.net/projects/wampserver/",target:"_blank",rel:"noopener noreferrer"},"\u5B98\u7F51\u5730\u5740"),s(" \u8FDB\u884C\u4E0B\u8F7D")],-1),gn=n("p",null,[n("img",{src:u,alt:"image-20210409195706494"})],-1),fn=n("h3",{id:"\u914D\u7F6E\u6587\u4EF6",tabindex:"-1"},[s("\u914D\u7F6E\u6587\u4EF6 "),n("a",{class:"header-anchor",href:"#\u914D\u7F6E\u6587\u4EF6","aria-hidden":"true"},"#")],-1),_n=n("p",null,[s("\u6253\u5F00\u5B89\u88C5\u76EE\u5F55\uFF0C\u628A\u8981\u5C55\u793A\u7684\u7F51\u9875\u653E\u5230"),n("code",null," wamp\\www"),s(" \u6587\u4EF6\u5939\u4E0B\uFF0C\u901A\u8FC7 127.0.0.1 \u6216\u8005 localhost \u8FDB\u884C\u8BBF\u95EE\u672C\u673A\u670D\u52A1\u5668\u3002")],-1),vn=n("p",null,"\u5C40\u57DF\u7F51\u5185\u5176\u4ED6\u8BBE\u5907\u60F3\u8981\u8BBF\u95EE \u672C\u673A\u670D\u52A1\u5668\uFF0C\u5219\u9700\u8981\u901A\u8FC7\u8BBF\u95EE\u672C\u673A\u7684 IP\u5730\u5740\uFF0C\u624D\u53EF\u4EE5\u8FDB\u884C\u8BBF\u95EE\u7F51\u9875\u3002",-1),wn=n("blockquote",null,[n("p",null,"\u4F8B\u5982\uFF1A192.168.1.102/index.html")],-1),xn=n("h4",{id:"\u8C03\u6574\u5C40\u57DF\u7F51\u6743\u9650",tabindex:"-1"},[s("\u8C03\u6574\u5C40\u57DF\u7F51\u6743\u9650 "),n("a",{class:"header-anchor",href:"#\u8C03\u6574\u5C40\u57DF\u7F51\u6743\u9650","aria-hidden":"true"},"#")],-1),yn=n("p",null,[s("\u5728\u5B89\u88C5\u76EE\u5F55\u4E0B\u627E\u5230 "),n("code",null,"wamp\\bin\\apache\\Apache2.4.4\\conf\\httpd.conf"),s(" \u914D\u7F6E\u6587\u4EF6")],-1),jn=n("p",null,[n("img",{src:i,alt:"image-20210409200447866"})],-1),qn=n("p",null,"^\u4EE5\u4E0A\u4E24\u79CD\u65B9\u6CD5\u90FD\u53EF\u4EE5\u6253\u5F00\u8BE5\u6587\u4EF6^",-1),Sn=n("p",null,[s("=="),n("em",null,"\u6CE8\u610F\uFF1A\u4FEE\u6539\u914D\u7F6E\u6587\u4EF6\u4E4B\u524D\u4E00\u5B9A\u8981\u505A\u6587\u4EF6\u5907\u4EFD\uFF0C\u4EE5\u514D\u6539\u6BC1\u6587\u4EF6\u65E0\u6CD5\u64A4\u56DE\u3002"),s("==")],-1),Tn=n("p",null,[n("img",{src:r,alt:"image-20210409200853957"})],-1),Dn=n("blockquote",null,[n("ol",null,[n("li",null,[n("p",null,[s("\u914D\u7F6E\u6587\u4EF6\u663E\u793A "),n("strong",null,"Deny from all"),s("\uFF0C\u6240\u4EE5\u5C40\u57DF\u7F51\u5185\u5176\u4ED6\u8BBE\u5907\u65E0\u6CD5\u8BBF\u95EE\uFF0C\u6240\u4EE5\u8981\u6539\u4E3A "),n("strong",null,"Allow from all"),s("\uFF0C\u4FDD\u5B58\u6587\u4EF6\u3002")])]),n("li",null,[n("p",null,[n("strong",null,"\u70B9\u51FB\u5C0F\u56FE\u6807\uFF0C\u91CD\u542F\u670D\u52A1\u5668\uFF0C==\u4E00\u5B9A\u8981\u91CD\u542F\u670D\u52A1==\u3002")]),n("p",null,[n("img",{src:k,alt:"image-20210409201752214"})])])]),n("p",null,"\u5230\u6B64\uFF0C\u5C40\u57DF\u7F51\u5185\u5C31\u53EF\u4EE5\u5BF9\u672C\u5730\u670D\u52A1\u5668\u8FDB\u884C\u8BBF\u95EE\u3002")],-1),Nn=n("h4",{id:"\u66F4\u6539\u7F51\u7AD9\u6839\u8DEF\u5F84",tabindex:"-1"},[s("\u66F4\u6539\u7F51\u7AD9\u6839\u8DEF\u5F84 "),n("a",{class:"header-anchor",href:"#\u66F4\u6539\u7F51\u7AD9\u6839\u8DEF\u5F84","aria-hidden":"true"},"#")],-1),Ln=n("p",null,[s("\u5982\u4F55\u4E0D\u4F7F\u7528\u6587\u4EF6\u8DEF\u5F84\u8FDB\u884C\u8BBF\u95EE\uFF0C\u53EF\u4EE5\u8FDB\u5165 "),n("code",null,"wamp\\bin\\apache\\Apache2.4.4\\conf\\httpd.conf"),s(" \u914D\u7F6E\u6587\u4EF6 \u8FDB\u884C\u4FEE\u6539\uFF0C\u5C06 DocumentRoot \u7684\u8DEF\u5F84\u6539\u4E3A\u60F3\u8981\u7684\u8DEF\u5F84\u5373\u53EF\u3002\uFF08\u4E24\u4E2A\u8DEF\u5F84\u90FD\u9700\u8981\u66F4\u6539\uFF09")],-1),On=n("p",null,[n("img",{src:b,alt:"image-20210409202257820"})],-1),Jn=n("p",null,"\u4FEE\u6539\u5B8C\u914D\u7F6E\u6587\u4EF6\u540E\uFF0C\u4FDD\u5B58\u5E76\u91CD\u542F\u670D\u52A1\u3002",-1),En=n("p",null,"==\u66F4\u6539\u540E\u7684\u8DEF\u5F84\u5C31\u662F\u7F51\u7AD9\u8981\u5B58\u653E\u7684\u5730\u65B9\u3002==",-1),Pn=n("h3",{id:"\u865A\u62DF\u4E3B\u673A\u914D\u7F6E",tabindex:"-1"},[s("\u865A\u62DF\u4E3B\u673A\u914D\u7F6E "),n("a",{class:"header-anchor",href:"#\u865A\u62DF\u4E3B\u673A\u914D\u7F6E","aria-hidden":"true"},"#")],-1),Cn=n("blockquote",null,[n("p",null,"\u6839\u636E\u57DF\u540D\u8BF7\u6C42\u6D41\u7A0B\uFF0C\u8BBF\u95EE\u57DF\u540D\u65F6\u5148\u8BBF\u95EE\u672C\u5730 hosts \u6587\u4EF6\uFF0C\u518D\u53BB\u8BBF\u95EE DNS \u89E3\u6790\u3002")],-1),Hn=n("ol",null,[n("li",null,[s("\u6253\u5F00 C\u76D8\uFF0C\u627E "),n("code",null,"Windows\\System32\\Drives\\etc\\hosts"),s(" \u6587\u4EF6\uFF08\u6253\u5F00\u65F6\u7528 Notepad++ \u7BA1\u7406\u5458\u8FD0\u884C\u6587\u4EF6\uFF09")]),n("li",null,"\u5728\u6587\u4EF6\u6700\u540E\u52A0\u4E0A \u672C\u673AIP\u5730\u5740 \u548C \u81EA\u5B9A\u4E49\u7684\u57DF\u540D")],-1),Mn=n("p",null,[n("img",{src:m,alt:"image-20210409205248730"})],-1),Rn=n("p",null,"\u6B64\u65F6\uFF0C\u5C31\u53EF\u4EE5\u901A\u8FC7\u81EA\u5B9A\u4E49\u57DF\u540D\u8FDB\u884C\u8BBF\u95EE\u4E86\u3002",-1),An=n("h4",{id:"\u4E00\u53F0\u670D\u52A1\u5668\u63D0\u4F9B\u591A\u4E2A\u7AD9\u70B9",tabindex:"-1"},[s("\u4E00\u53F0\u670D\u52A1\u5668\u63D0\u4F9B\u591A\u4E2A\u7AD9\u70B9 "),n("a",{class:"header-anchor",href:"#\u4E00\u53F0\u670D\u52A1\u5668\u63D0\u4F9B\u591A\u4E2A\u7AD9\u70B9","aria-hidden":"true"},"#")],-1),$n=n("blockquote",null,[n("p",null,[s("\u6253\u5F00\u5B89\u88C5\u76EE\u5F55\uFF0C\u8FDB\u5165 "),n("code",null,"wamp\\bin\\apache\\Apache2.4.4\\conf\\httpd.conf"),s(" \u914D\u7F6E\u6587\u4EF6 \u8FDB\u884C\u4FEE\u6539\uFF0C\u641C\u7D22\u5173\u952E\u5B57 "),n("strong",null,"Virtual hosts")])],-1),Xn=n("p",null,[n("img",{src:d,alt:"image-20210409211325423"})],-1),In=n("ol",null,[n("li",null,[n("p",null,[s("\u53BB\u6389 # \uFF0C\u5E76\u6253\u5F00\u8FD9\u4E2A\u914D\u7F6E\u6587\u4EF6\uFF08 "),n("code",null,"wamp\\bin\\apache\\Apache2.4.4\\conf\\extra\\httpd-vohsts.conf"),s(" \uFF09")])]),n("li",null,[n("p",null,"\u60F3\u8981\u51E0\u4E2A\u7AD9\u70B9\uFF0C\u5C31\u590D\u5236\u51E0\u4EFD\u914D\u7F6E\u6587\u4EF6"),n("p",null,[n("img",{src:h,alt:"image-20210409211821294"})]),n("p",null,"==\u590D\u5236\u51FA\u6765\u7684\u914D\u7F6E\u6587\u4EF6\uFF0C\u53EA\u9700\u8981\u4F7F\u7528\u4E24\u4E2A\uFF0C\u591A\u4F59\u7684\u53EF\u4EE5\u5220\u6389\u3002=="),n("p",null,[n("img",{src:g,alt:"image-20210409212247774"})])]),n("li",null,[n("p",null,"\u901A\u8FC7 \u81EA\u5B9A\u4E49\u57DF\u540D+\u7F51\u9875\u540D \u5C31\u53EF\u4EE5\u8FDB\u884C\u8BBF\u95EE"),n("div",{class:"language-http line-numbers-mode"},[n("pre",null,[n("code",null,`www.zhangsan.com/test.html
  `)]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br")])])])],-1),Fn=n("p",null,"\u6D4B\u8BD5\u8FC7\u7A0B\u4E2D\u60F3\u8981\u5728\u81EA\u5DF1\u7684\u7535\u8111\u4E0A\u8BBF\u95EE\uFF08\u57DF\u540D\uFF09\uFF0C\u5219\u9700\u8981\u5728 hosts \u6587\u4EF6\u4E2D\u8FDB\u884C\u914D\u7F6E\u3002",-1),Un=n("blockquote",null,[n("p",null,"\u5728\u6700\u540E\u52A0\u4E0A\u81EA\u5B9A\u4E49\u57DF\u540D")],-1),Gn=n("p",null,[n("img",{src:f,alt:"image-20210409213657063"})],-1),Bn=n("p",null,[n("strong",null,"\u7F51\u5740\u4F1A\u8FDB\u884C\u57DF\u540D\u91CD\u5B9A\u5411")],-1),zn=n("p",null,[n("img",{src:_,alt:"image-20210409213735355"})],-1),Wn=n("h2",{id:"get-\u548C-post-\u8BF7\u6C42",tabindex:"-1"},[s("GET \u548C POST \u8BF7\u6C42 "),n("a",{class:"header-anchor",href:"#get-\u548C-post-\u8BF7\u6C42","aria-hidden":"true"},"#")],-1),Qn=n("h3",{id:"get-\u8BF7\u6C42",tabindex:"-1"},[s("GET \u8BF7\u6C42 "),n("a",{class:"header-anchor",href:"#get-\u8BF7\u6C42","aria-hidden":"true"},"#")],-1),Vn=n("blockquote",null,[n("p",null,[s("\u83B7\u53D6\uFF1B\u5982\u679C"),n("strong",null,"\u5411\u670D\u52A1\u5668\u53D1\u9001\u8BF7\u6C42\uFF0C\u83B7\u53D6\u670D\u52A1\u5668\u7684\u8D44\u6E90"),s("\uFF0C\u4F7F\u7528GET\u65B9\u5F0F\u3002")]),n("ul",null,[n("li",null,"\u83B7\u53D6\u9875\u9762\u4E2D\u9700\u8981\u7684\u6570\u636E\uFF08\u83B7\u53D6\u4E00\u4E2A\u7528\u6237\u7684\u4FE1\u606F\uFF09")])],-1),Kn=n("h3",{id:"post-\u8BF7\u6C42",tabindex:"-1"},[s("POST \u8BF7\u6C42 "),n("a",{class:"header-anchor",href:"#post-\u8BF7\u6C42","aria-hidden":"true"},"#")],-1),Yn=n("blockquote",null,[n("p",null,[s("\u90AE\u5BC4\uFF08\u63D0\u4EA4\uFF09\u3002\u5982\u679C"),n("strong",null,"\u63D0\u4EA4\u6570\u636E\u7ED9\u670D\u52A1\u5668"),s("\uFF0C\u90A3\u4E48\u4F7F\u7528POST\u65B9\u5F0F\u3002")]),n("p",null,"POST \u65B9\u6CD5\u7528\u4E8E\u5C06\u5B9E\u4F53\u63D0\u4EA4\u5230\u6307\u5B9A\u7684\u8D44\u6E90\uFF0C\u901A\u5E38\u5BFC\u81F4\u5728\u670D\u52A1\u5668\u4E0A\u7684\u72B6\u6001\u53D8\u5316\u6216\u526F\u4F5C\u7528\u3002"),n("p",null,[n("strong",null,"\u6DFB\u52A0\u3001\u4FEE\u6539\u90FD\u53EF\u4EE5\u4F7F\u7528 POST \u8BF7\u6C42\uFF0C\u56E0\u4E3A\u6B64\u7C7B\u64CD\u4F5C\u90FD\u4F1A\u6539\u53D8\u670D\u52A1\u5668\u4E0A\u7684\u8D44\u6E90\u3002")]),n("ul",null,[n("li",null,"\u767B\u5F55\u3001\u6CE8\u518C\uFF08\u63D0\u4EA4\u8D26\u53F7\u548C\u5BC6\u7801\u7ED9\u670D\u52A1\u5668\uFF09")])],-1),Zn=n("h3",{id:"\u5176\u4ED6\u8BF7\u6C42",tabindex:"-1"},[s("\u5176\u4ED6\u8BF7\u6C42 "),n("a",{class:"header-anchor",href:"#\u5176\u4ED6\u8BF7\u6C42","aria-hidden":"true"},"#")],-1),ns=n("h4",{id:"put-\u8BF7\u6C42",tabindex:"-1"},[s("PUT \u8BF7\u6C42 "),n("a",{class:"header-anchor",href:"#put-\u8BF7\u6C42","aria-hidden":"true"},"#")],-1),ss=n("blockquote",null,[n("p",null,"PUT\u65B9\u6CD5\u7528\u8BF7\u6C42\u6709\u6548\u8F7D\u8377\u66FF\u6362\u76EE\u6807\u8D44\u6E90\u7684\u6240\u6709\u5F53\u524D\u8868\u793A\u3002"),n("p",null,"\u4FEE\u6539\u64CD\u4F5C\u53EF\u4EE5\u9009\u62E9\u4F7F\u7528 PUT \u65B9\u5F0F\u3002")],-1),as=n("h4",{id:"delete-\u8BF7\u6C42",tabindex:"-1"},[s("DELETE \u8BF7\u6C42 "),n("a",{class:"header-anchor",href:"#delete-\u8BF7\u6C42","aria-hidden":"true"},"#")],-1),ts=n("blockquote",null,[n("p",null,"DELETE\u65B9\u6CD5\u5220\u9664\u6307\u5B9A\u7684\u8D44\u6E90\u3002"),n("p",null,"\u5220\u9664\u64CD\u4F5C\u53EF\u4EE5\u4F7F\u7528 DELETE \u65B9\u5F0F\u3002")],-1),es=n("h2",{id:"jquery-\u4E2D\u5C01\u88C5\u7684-ajax-\u76F8\u5173\u65B9\u6CD5",tabindex:"-1"},[s("jQuery \u4E2D\u5C01\u88C5\u7684 Ajax \u76F8\u5173\u65B9\u6CD5 "),n("a",{class:"header-anchor",href:"#jquery-\u4E2D\u5C01\u88C5\u7684-ajax-\u76F8\u5173\u65B9\u6CD5","aria-hidden":"true"},"#")],-1),os=n("blockquote",null,[n("p",null,[s("\u5F15\u5165\u811A\u672C\u7F51\u7EDC\u5730\u5740\uFF1A"),n("a",{href:"https://www.bootcdn.cn/",target:"_blank",rel:"noopener noreferrer"},"https://www.bootcdn.cn/")])],-1),cs=n("h3",{id:"get-\u65B9\u6CD5",tabindex:"-1"},[s("$.get() \u65B9\u6CD5 "),n("a",{class:"header-anchor",href:"#get-\u65B9\u6CD5","aria-hidden":"true"},"#")],-1),ls=n("blockquote",null,[n("p",null,[s("$.get() \u51FD\u6570\u7684\u529F\u80FD\u5355\u4E00\uFF0C"),n("strong",null,"\u4E13\u95E8\u7528\u6765\u53D1\u8D77 get \u8BF7\u6C42"),s("\uFF0C\u4ECE\u800C\u5C06\u670D\u52A1\u5668\u4E0A\u7684\u8D44\u6E90\u8BF7\u6C42\u5230\u5BA2\u6237\u7AEF\u6765\u8FDB\u884C\u4F7F\u7528\u3002")]),n("p",null,"\u53C2\u6570\u4E00\uFF1A\u8BF7\u6C42\u8D44\u6E90\u5730\u5740\u3002")],-1),ps=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token operator"},"/"),s(` \u8BED\u6CD5\u683C\u5F0F\uFF1A
  $`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"get"),n("span",{class:"token punctuation"},"("),s("url"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"["),s("data"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"["),s("success"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"["),s("datatype"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br")])],-1),us=n("table",null,[n("thead",null,[n("tr",null,[n("th",{style:{"text-align":"left"}},"\u53C2\u6570"),n("th",{style:{"text-align":"left"}},"\u7C7B\u578B"),n("th",{style:{"text-align":"left"}},"\u542B\u4E49")])]),n("tbody",null,[n("tr",null,[n("td",{style:{"text-align":"left"}},"url"),n("td",{style:{"text-align":"left"}},"string"),n("td",{style:{"text-align":"left"}},"**\u5FC5\u9700\u3002**\u8BF7\u6C42\u7684\u8D44\u6E90\u7684\u5730\u5740\uFF0C\u4E00\u822C\u7531\u540E\u7AEF\u540C\u5B66\u63D0\u4F9B \u3002")]),n("tr",null,[n("td",{style:{"text-align":"left"}},"data"),n("td",{style:{"text-align":"left"}},"string|array|object"),n("td",{style:{"text-align":"left"}},"\u4E0D\u5FC5\u9700\u3002 \u8BF7\u6C42\u53C2\u6570\uFF0C\u7531\u540E\u7AEF\u540C\u5B66\u8BBE\u8BA1\u3002")]),n("tr",null,[n("td",{style:{"text-align":"left"}},"success"),n("td",{style:{"text-align":"left"}},"function"),n("td",{style:{"text-align":"left"}},"\u4E0D\u5FC5\u9700\u3002\u8BF7\u6C42\u6210\u529F\u540E\u89E6\u53D1\u7684\u56DE\u8C03\u51FD\u6570\uFF0C\u51FD\u6570\u7684\u5F62\u53C2\u4E3A\u54CD\u5E94\u7ED3\u679C\u3002")]),n("tr",null,[n("td",{style:{"text-align":"left"}},"dataType"),n("td",{style:{"text-align":"left"}},"string"),n("td",{style:{"text-align":"left"}},"\u4E0D\u5FC5\u9700\u3002\u9884\u671F\u670D\u52A1\u5668\u54CD\u5E94\u6570\u636E\u7684\u7C7B\u578B\uFF0C\u4E00\u822C\u4E0D\u7528\u8BBE\u7F6E\u3002")])])],-1),is=n("h4",{id:"\u83B7\u53D6\u6570\u636E",tabindex:"-1"},[s("\u83B7\u53D6\u6570\u636E "),n("a",{class:"header-anchor",href:"#\u83B7\u53D6\u6570\u636E","aria-hidden":"true"},"#")],-1),rs=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// \u53D1\u9001 get\u8BF7\u6C42\uFF0C\u83B7\u53D6\u6570\u636E"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" btn "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'button'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  btn`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"addEventListener"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'click'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[s("e "),n("span",{class:"token operator"},"="),s(" window"),n("span",{class:"token punctuation"},"."),s("event")]),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(`
      $`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"get"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/getbooks'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token parameter"},"data"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token comment"},"// \u6253\u5370\u54CD\u5E94\u7ED3\u679C"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br")])],-1),ks=n("h4",{id:"\u83B7\u53D6\u67D0\u4E00\u6761\u6570\u636E",tabindex:"-1"},[s("\u83B7\u53D6\u67D0\u4E00\u6761\u6570\u636E "),n("a",{class:"header-anchor",href:"#\u83B7\u53D6\u67D0\u4E00\u6761\u6570\u636E","aria-hidden":"true"},"#")],-1),bs=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s(`\u94FE\u63A5\u540E\u52A0\u67E5\u8BE2\u6761\u4EF6
  \u4F8B\u5982\uFF1A`),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/getbooks?id=1'"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br")])],-1),ms=n("h4",{id:"\u5220\u9664\u67D0\u4E00\u6761\u6570\u636E",tabindex:"-1"},[s("\u5220\u9664\u67D0\u4E00\u6761\u6570\u636E "),n("a",{class:"header-anchor",href:"#\u5220\u9664\u67D0\u4E00\u6761\u6570\u636E","aria-hidden":"true"},"#")],-1),ds=n("blockquote",null,[n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s(`\u94FE\u63A5\u540E\u52A0\u5220\u9664\u6761\u4EF6
  \u4F8B\u5982\uFF1A`),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/delbooks?id=1'"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br")])])],-1),hs=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("btns"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"2"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"addEventListener"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'click'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[s("e "),n("span",{class:"token operator"},"="),s(" window"),n("span",{class:"token punctuation"},"."),s("event")]),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(`
      $`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"get"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},'"http://www.liulongbin.top:3006/api/delbook?id=2"'),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token parameter"},"data"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'\u5F53\u524D\u5220\u9664\u6570\u636E\uFF1A'"),n("span",{class:"token punctuation"},","),s(" data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br")])],-1),gs=n("h4",{id:"\u5220\u9664\u5F53\u524D\u6240\u6709\u6570\u636E",tabindex:"-1"},[s("\u5220\u9664\u5F53\u524D\u6240\u6709\u6570\u636E "),n("a",{class:"header-anchor",href:"#\u5220\u9664\u5F53\u524D\u6240\u6709\u6570\u636E","aria-hidden":"true"},"#")],-1),fs=n("blockquote",null,[n("p",null,"\u601D\u8DEF\uFF1A"),n("ol",null,[n("li",null,"\u83B7\u53D6\u5F53\u524D\u6240\u6709\u5143\u7D20\u7684\uFF0C\u5B58\u50A8\u5230\u65B0\u6570\u7EC4\u4E2D\u3002"),n("li",null,"\u5FAA\u73AF\u5F53\u524D\u6570\u7EC4\uFF0C\u5E76\u5220\u9664\u5F53\u524D\u5143\u7D20\u4E0B\u6807\u4E3A\u5F53\u524D\u6570\u7EC4\u5143\u7D20 id \u503C\u3002")])],-1),_s=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("btns"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"3"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"addEventListener"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'click'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[s("e "),n("span",{class:"token operator"},"="),s(" window"),n("span",{class:"token punctuation"},"."),s("event")]),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(`
      $`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"get"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},'"http://www.liulongbin.top:3006/api/getbooks"'),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token parameter"},"data"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token keyword"},"let"),s(" list "),n("span",{class:"token operator"},"="),s(" data"),n("span",{class:"token punctuation"},"."),s("data"),n("span",{class:"token punctuation"},";"),s(`
  
          `),n("span",{class:"token keyword"},"for"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"let"),s(" i"),n("span",{class:"token operator"},"="),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),s(" i"),n("span",{class:"token operator"},"<"),s("list"),n("span",{class:"token punctuation"},"."),s("length"),n("span",{class:"token punctuation"},";"),s(" i"),n("span",{class:"token operator"},"++"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
              $`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"get"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"http://www.liulongbin.top:3006/api/delbook?id="),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),s("list"),n("span",{class:"token punctuation"},"["),s("i"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),s("id"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token parameter"},"data"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(`
                  console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'\u5F53\u524D\u5220\u9664\u6570\u636E\uFF1A'"),n("span",{class:"token punctuation"},","),s(" data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
                  console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'\u5220\u9664\u6210\u529F'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
              `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
          `),n("span",{class:"token punctuation"},"}"),s(`
  
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br")])],-1),vs=n("h3",{id:"post-\u65B9\u6CD5",tabindex:"-1"},[s("$.post \u65B9\u6CD5 "),n("a",{class:"header-anchor",href:"#post-\u65B9\u6CD5","aria-hidden":"true"},"#")],-1),ws=n("blockquote",null,[n("p",null,"\u7528\u6765\u6DFB\u52A0\u6570\u636E\u3002"),n("p",null,[s("\u53C2\u6570\u4E00\uFF1A\u8BF7\u6C42\u8D44\u6E90\u5730\u5740\u3002 "),n("strong",null,"\u53C2\u6570\u4E8C\uFF1A\u8BF7\u6C42\u53C2\u6570\u3002\u53C2\u6570\u4E09\uFF1A\u56DE\u8C03\u51FD\u6570\u3002")])],-1),xs=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// \u8BED\u6CD5\u683C\u5F0F\uFF1A"),s(`
  $`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"post"),n("span",{class:"token punctuation"},"("),s("url"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"["),s("data"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"["),s("success"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"["),s("datatype"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br")])],-1),ys=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// \u53D1\u9001 get\u8BF7\u6C42\uFF0C\u83B7\u53D6\u6570\u636E"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" btns "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'button'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  btn`),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"addEventListener"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'click'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[s("e "),n("span",{class:"token operator"},"="),s(" window"),n("span",{class:"token punctuation"},"."),s("event")]),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(`
      $`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"get"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/getbooks'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token parameter"},"data"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token comment"},"// \u6253\u5370\u54CD\u5E94\u7ED3\u679C"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  
  `),n("span",{class:"token comment"},"// \u53D1\u9001 post \u8BF7\u6C42\uFF0C\u6DFB\u52A0\u6570\u636E"),s(`
  btns`),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"addEventListener"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'click'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[s("e"),n("span",{class:"token operator"},"="),s("window"),n("span",{class:"token punctuation"},"."),s("event")]),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token comment"},"// \u5B9A\u4E49\u8981\u6DFB\u52A0\u7684\u6570\u636E"),s(`
      `),n("span",{class:"token keyword"},"let"),s(" data "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token punctuation"},"{"),s(" bookname"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},'"\u4E00\u4E2A\u4EBA\u5C31\u4E00\u4E2A\u4EBA"'),n("span",{class:"token punctuation"},","),s(" author"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},'"\u5218\u540C"'),n("span",{class:"token punctuation"},","),s(" publisher"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},'"\u56FE\u4E66\u51FA\u7248\u793E"'),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),s(`
      $`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"post"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},'"http://www.liulongbin.top:3006/api/addbook"'),n("span",{class:"token punctuation"},","),s(" data"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token parameter"},"data"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br")])],-1),js=n("h3",{id:"ajax-\u65B9\u6CD5",tabindex:"-1"},[s("$.ajax \u65B9\u6CD5 "),n("a",{class:"header-anchor",href:"#ajax-\u65B9\u6CD5","aria-hidden":"true"},"#")],-1),qs=n("blockquote",null,[n("p",null,"\u76F8\u5F53\u4E0E get \u65B9\u6CD5\u548C post \u65B9\u6CD5\u7684\u5C01\u88C5\u3002")],-1),Ss=n("blockquote",null,[n("p",null,[n("strong",null,"type\uFF1A\u4E0D\u5199\u9ED8\u8BA4\u662F get")]),n("p",null,[s("=="),n("strong",null,"\u6267\u884C\u4E0D\u4E00\u6837\u7684\u64CD\u4F5C\u65F6\uFF0C\u8981\u6539\u94FE\u63A5\u540E\u7684 api \u63A5\u53E3\u5730\u5740\u3002"),s("==")]),n("ul",null,[n("li",null,[n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code")]),n("div",{class:"line-numbers-wrapper"})])])]),n("p",null,[s("url: '"),n("a",{href:"http://www.liulongbin.top:3006/api/delbook?id=2",target:"_blank",rel:"noopener noreferrer"},"http://www.liulongbin.top:3006/api/delbook?id=2"),s("', url: '"),n("a",{href:"http://www.liulongbin.top:3006/api/getbooks",target:"_blank",rel:"noopener noreferrer"},"http://www.liulongbin.top:3006/api/getbooks"),s("',")]),n("div",{class:"language-"},[n("pre",null,[n("code")]),n("div",{class:"line-numbers-wrapper"})])],-1),Ts=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("btns"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"addEventListener"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'click'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[s("e "),n("span",{class:"token operator"},"="),s(" window"),n("span",{class:"token punctuation"},"."),s("event")]),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(`
      $`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"ajax"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),s(`
          type`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'post'"),n("span",{class:"token punctuation"},","),s(`
          url`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/addbook'"),n("span",{class:"token punctuation"},","),s(`
          data`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(" bookname"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},'"\u4E00\u4E2A\u4EBA\u5C31\u4E00\u4E2A\u4EBA"'),n("span",{class:"token punctuation"},","),s(" author"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},'"\u5218\u540C"'),n("span",{class:"token punctuation"},","),s(" publisher"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},'"\u56FE\u4E66\u51FA\u7248\u793E"'),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(`
          `),n("span",{class:"token function-variable function"},"success"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"res"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
              console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("res"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  
  `),n("span",{class:"token comment"},"// res \u8868\u793A\u8FD4\u56DE\u7684\u6570\u636E"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br")])],-1),Ds=n("h2",{id:"\u63A5\u53E3\u53CA\u63A5\u53E3\u6587\u6863",tabindex:"-1"},[s("\u63A5\u53E3\u53CA\u63A5\u53E3\u6587\u6863 "),n("a",{class:"header-anchor",href:"#\u63A5\u53E3\u53CA\u63A5\u53E3\u6587\u6863","aria-hidden":"true"},"#")],-1),Ns=n("h3",{id:"\u63A5\u53E3",tabindex:"-1"},[s("\u63A5\u53E3 "),n("a",{class:"header-anchor",href:"#\u63A5\u53E3","aria-hidden":"true"},"#")],-1),Ls=n("blockquote",null,[n("p",null,"\u540E\u7AEF\u8BBE\u8BA1\u7684\u63A5\u53E3\u3002"),n("p",null,"\u63A5\u53E3\u662F\u670D\u52A1\u5668\u63D0\u4F9B\u7684\u4E00\u4E2Aurl\u5730\u5740\uFF0C\u901A\u8FC7\u8FD9\u4E2Aurl\u5730\u5740\uFF0C\u6211\u4EEC\u53EF\u4EE5\u64CD\u4F5C\u670D\u52A1\u5668\u4E0A\u7684\u8D44\u6E90\u3002"),n("p",null,"\u901A\u8FC7Ajax\u6280\u672F\u5411\u4E00\u4E2A\u63A5\u53E3\u53D1\u9001\u8BF7\u6C42\uFF0C\u4E5F\u53EB\u505A\u8C03\u7528\u63A5\u53E3\u3002")],-1),Os=n("h3",{id:"\u63A5\u53E3\u6587\u6863",tabindex:"-1"},[s("\u63A5\u53E3\u6587\u6863 "),n("a",{class:"header-anchor",href:"#\u63A5\u53E3\u6587\u6863","aria-hidden":"true"},"#")],-1),Js=n("blockquote",null,[n("p",null,"\u540E\u7AEF\u63D0\u4F9B\u7684\u63A5\u53E3\u4F7F\u7528\u624B\u518C\u3002")],-1),Es=n("table",null,[n("thead",null,[n("tr",null,[n("th",{style:{"text-align":"center"}},"\u5305\u542B\u5185\u5BB9"),n("th",{style:{"text-align":"center"}},"\u89E3\u91CA")])]),n("tbody",null,[n("tr",null,[n("td",{style:{"text-align":"center"}},"\u63A5\u53E3\u8BF4\u660E"),n("td",{style:{"text-align":"center"}},"\u901A\u8FC7\u63A5\u53E3\u8BF4\u660E\uFF0C\u5927\u81F4\u4E86\u89E3\u5230\u63A5\u53E3\u662F\u5E72\u4EC0\u4E48\u7528\u7684")]),n("tr",null,[n("td",{style:{"text-align":"center"}},"\u63A5\u53E3\u7684url"),n("td",{style:{"text-align":"center"}},"\u53D1\u9001ajax\u8BF7\u6C42\uFF0C\u5FC5\u8981\u7684\u6761\u4EF6")]),n("tr",null,[n("td",{style:{"text-align":"center"}},"\u63A5\u53E3\u8BF7\u6C42\u65B9\u5F0F"),n("td",{style:{"text-align":"center"}},"\u53D1\u9001ajax\u8BF7\u6C42\uFF0C\u5FC5\u8981\u7684\u6761\u4EF6")]),n("tr",null,[n("td",{style:{"text-align":"center"}},"\u8BF7\u6C42\u53C2\u6570"),n("td",{style:{"text-align":"center"}},"\u53C2\u6570\u540D\u79F0\u3001\u6570\u636E\u7C7B\u578B\u3001\u662F\u5426\u5FC5\u586B\u3001\u53C2\u6570\u8BF4\u660E\u7B49")]),n("tr",null,[n("td",{style:{"text-align":"center"}},"\u54CD\u5E94\u683C\u5F0F"),n("td",{style:{"text-align":"center"}})]),n("tr",null,[n("td",{style:{"text-align":"center"}},"\u54CD\u5E94\u793A\u4F8B"),n("td",{style:{"text-align":"center"}})])])],-1),Ps=n("h2",{id:"network-\u63A7\u5236\u53F0",tabindex:"-1"},[s("Network \u63A7\u5236\u53F0 "),n("a",{class:"header-anchor",href:"#network-\u63A7\u5236\u53F0","aria-hidden":"true"},"#")],-1),Cs=n("p",null,"\u5F85\u8865\u5145",-1),Hs=n("h2",{id:"xmlhttprequest-\u5BF9\u8C61",tabindex:"-1"},[s("XMLHttpRequest \u5BF9\u8C61 "),n("a",{class:"header-anchor",href:"#xmlhttprequest-\u5BF9\u8C61","aria-hidden":"true"},"#")],-1),Ms=n("blockquote",null,[n("p",null,"XHR 1.0 \u662F\u4E00\u4E2A\u5185\u5EFA\u7684\u6D4F\u89C8\u5668\u5BF9\u8C61\uFF0C\u53EF\u4EE5\u5B9E\u73B0 Ajax \u8BF7\u6C42\uFF0CAjax\u6280\u672F\u7684\u6838\u5FC3\u5C31\u662FXMLHttpRequest \u5BF9\u8C61\u3002"),n("p",null,"==GET\u662F\u5728open\u91CC\u4F20\u53C2\uFF0CPOST\u662F\u5728send\u91CC\u4F20\u53C2\u3002==")],-1),Rs=n("h3",{id:"\u539F\u751F-js-\u5B9E\u73B0\u57FA\u672C\u7684-get-\u8BF7\u6C42",tabindex:"-1"},[s("\u539F\u751F Js \u5B9E\u73B0\u57FA\u672C\u7684 GET \u8BF7\u6C42 "),n("a",{class:"header-anchor",href:"#\u539F\u751F-js-\u5B9E\u73B0\u57FA\u672C\u7684-get-\u8BF7\u6C42","aria-hidden":"true"},"#")],-1),As=n("h4",{id:"\u83B7\u53D6\u6240\u6709\u6570\u636E",tabindex:"-1"},[s("\u83B7\u53D6\u6240\u6709\u6570\u636E "),n("a",{class:"header-anchor",href:"#\u83B7\u53D6\u6240\u6709\u6570\u636E","aria-hidden":"true"},"#")],-1),$s=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// 1.\u521B\u5EFAXMLHttpRequest \u5BF9\u8C61"),s(`
  `),n("span",{class:"token keyword"},"var"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  `),n("span",{class:"token comment"},"// 2.\u76D1\u542C onreadystatechange \u4E8B\u4EF6"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onreadystatechange"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token comment"},"// 2.1 \u5F53 Ajax \u8BF7\u6C42\u54CD\u5E94\u5B8C\u540E\uFF0C\u518D\u62FF\u5230\u670D\u52A1\u5668\u54CD\u5E94\u7684\u6570\u636E"),s(`
      `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("readyState "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"4"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token comment"},"// 2.2 \u7528 JSON.parse \u5C06\u7ED3\u679C\u8F6C\u6210\u5BF9\u8C61"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s(),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  
  `),n("span",{class:"token comment"},"// 3.\u8BBE\u7F6E\u8BF7\u6C42\u65B9\u5F0F\u548C\u8BF7\u6C42\u5730\u5740"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'get'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/getbooks'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  `),n("span",{class:"token comment"},"// 4.\u53D1\u9001 ajax \u8BF7\u6C42"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br")])],-1),Xs=n("h4",{id:"\u83B7\u53D6\u6307\u5B9A\u6570\u636E",tabindex:"-1"},[s("\u83B7\u53D6\u6307\u5B9A\u6570\u636E "),n("a",{class:"header-anchor",href:"#\u83B7\u53D6\u6307\u5B9A\u6570\u636E","aria-hidden":"true"},"#")],-1),Is=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// \u521B\u5EFA xhr \u5BF9\u8C61"),s(`
  `),n("span",{class:"token keyword"},"var"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token comment"},"// \u6CE8\u518C\u4E8B\u4EF6"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onreadystatechange"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token comment"},"// \u5F53 Ajax \u8BF7\u6C42\u54CD\u5E94\u5B8C\u540E\uFF0C\u518D\u62FF\u5230\u670D\u52A1\u5668\u54CD\u5E94\u7684\u6570\u636E"),s(`
      `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("readyState "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"4"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token comment"},"// \u7528 JSON.parse \u5C06\u7ED3\u679C\u8F6C\u6210\u5BF9\u8C61"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s(),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  `),n("span",{class:"token comment"},"// \u8BBE\u7F6E\u8BF7\u6C42\u5934\uFF0C\u5E76\u8BBE\u7F6E\u8981\u83B7\u53D6\u7684\u6570\u636Eid"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'get'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/getbooks?id=1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token comment"},"// \u63D0\u4EA4\u8BF7\u6C42\u4F53"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br")])],-1),Fs=n("h4",{id:"\u5220\u9664\u6570\u636E",tabindex:"-1"},[s("\u5220\u9664\u6570\u636E "),n("a",{class:"header-anchor",href:"#\u5220\u9664\u6570\u636E","aria-hidden":"true"},"#")],-1),Us=n("blockquote",null,[n("p",null,"\u5220\u9664 id \u4E3A 5686 \u7684\u6570\u636E\u3002")],-1),Gs=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("btns"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"2"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"addEventListener"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'click'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[s("e "),n("span",{class:"token operator"},"="),s(" window"),n("span",{class:"token punctuation"},"."),s("event")]),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token comment"},"// \u521B\u5EFA xhr \u5BF9\u8C61"),s(`
      `),n("span",{class:"token keyword"},"var"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
      `),n("span",{class:"token comment"},"// \u6CE8\u518C\u4E8B\u4EF6"),s(`
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onreadystatechange"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token keyword"},"var"),s(" res "),n("span",{class:"token operator"},"="),s(" xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},";"),s(`
          `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("readyState "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"4"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
              `),n("span",{class:"token comment"},"// \u7528 JSON.parse \u5C06\u7ED3\u679C\u8F6C\u6210\u5BF9\u8C61"),s(`
              console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s(),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'get'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/delbook?id=5686'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
      `),n("span",{class:"token comment"},"// \u63D0\u4EA4\u8BF7\u6C42\u4F53"),s(`
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br")])],-1),Bs=n("h3",{id:"\u539F\u751F-js-\u5B9E\u73B0\u57FA\u672C\u7684-post-\u8BF7\u6C42",tabindex:"-1"},[s("\u539F\u751F Js \u5B9E\u73B0\u57FA\u672C\u7684 POST \u8BF7\u6C42 "),n("a",{class:"header-anchor",href:"#\u539F\u751F-js-\u5B9E\u73B0\u57FA\u672C\u7684-post-\u8BF7\u6C42","aria-hidden":"true"},"#")],-1),zs=n("blockquote",null,[n("p",null,[n("strong",null,"\u548C GET\u8BF7\u6C42\u6709\u4EE5\u4E0B\u533A\u522B\uFF1A")]),n("ul",null,[n("li",null,[n("p",null,[s("\u5728open \u548C send \u4E4B\u95F4\uFF0C"),n("strong",null,"\u5FC5\u987B\u8BBE\u7F6E\u8BF7\u6C42\u5934"),s("\uFF0C\u901A\u8FC7 Content-Type \u6807\u8BC6\u63D0\u4EA4\u7684\u6570\u636E\u7C7B\u578B\uFF08\u7F16\u7801\u683C\u5F0F\uFF09\u3002")]),n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("xhr"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"setRequestHeader"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Content-Type'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'application/x-www-form-urlencoded'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br")])])]),n("li",null,[n("p",null,[n("strong",null,"\u63D0\u4EA4\u7684\u8BF7\u6C42\u4F53"),s("\uFF0C\u4E0D\u662F\u62FC\u63A5\u5230url\u540E\u9762\uFF0C\u800C\u662F\u5F53\u505Asend\u65B9\u6CD5\u7684\u53C2\u6570\u3002")]),n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("xhr"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'bookname=\u53F2\u8BB0&author=\u53F8\u9A6C\u8FC1&publisher=\u5317\u4EAC\u5927\u5B66\u51FA\u7248\u793E'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br")])])])])],-1),Ws=n("h4",{id:"\u6DFB\u52A0\u6570\u636E",tabindex:"-1"},[s("\u6DFB\u52A0\u6570\u636E "),n("a",{class:"header-anchor",href:"#\u6DFB\u52A0\u6570\u636E","aria-hidden":"true"},"#")],-1),Qs=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// \u521B\u5EFA xhr \u5BF9\u8C61"),s(`
  `),n("span",{class:"token keyword"},"var"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  `),n("span",{class:"token comment"},"// \u6CE8\u518C\u4E8B\u4EF6"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onreadystatechange"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("readyState "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"4"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token comment"},"// \u7528 JSON.parse \u5C06\u7ED3\u679C\u8F6C\u6210\u5BF9\u8C61"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s(),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'post'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/addbook'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  `),n("span",{class:"token comment"},"// \u8BBE\u7F6E\u8BF7\u6C42\u5934"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"setRequestHeader"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Content-Type'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'application/x-www-form-urlencoded'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  `),n("span",{class:"token comment"},"// \u63D0\u4EA4\u8BF7\u6C42\u4F53"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},'"bookname=\u4E66\u540D&author=\u4F5C\u8005&publisher=\u51FA\u7248\u793E"'),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br")])],-1),Vs=n("h2",{id:"\u539F\u751F-js-\u8FDB\u884C\u5C01\u88C5",tabindex:"-1"},[s("\u539F\u751F Js \u8FDB\u884C\u5C01\u88C5 "),n("a",{class:"header-anchor",href:"#\u539F\u751F-js-\u8FDB\u884C\u5C01\u88C5","aria-hidden":"true"},"#")],-1),Ks=n("blockquote",null,[n("p",null,"\u8FD8\u539F jQuery \u4E2D\u7684 get \u548C post \u65B9\u6CD5\u7684\u5C01\u88C5\u3002"),n("blockquote",null,[n("p",null,"\u5206\u6790\uFF1A"),n("ul",null,[n("li",null,[s("\u51FD\u6570\u53EA\u6709\u4E00\u4E2A\u53C2\u6570\uFF0C\u662F\u4E00\u4E2A\u5BF9\u8C61\u3002 "),n("ul",null,[n("li",null,"\u5305\u62EC\uFF1Atype\u3001url\u3001data\u3001success \u56DB\u4E2A\u5C5E\u6027\u3002")])]),n("li",null,"GET \u548C POST \u8BF7\u6C42\uFF0C\u90FD\u9700\u8981\u521B\u5EFA xhr \u5BF9\u8C61\uFF0C\u90FD\u9700\u8981\u8BBE\u7F6E onreadystatechange \u4E8B\u4EF6\u3002"),n("li",null,"\u5F53\u5F97\u5230\u54CD\u5E94\u7ED3\u679C\u540E\uFF0C\u8C03\u7528 success \u51FD\u6570\u540E\uFF0C\u628A\u7ED3\u679C\u4F20\u9012\u7ED9 success \u51FD\u6570\u3002"),n("li",null,"\u9700\u8981\u628A\u5BF9\u8C61\u5F62\u5F0F\u7684\u8BF7\u6C42\u53C2\u6570\uFF0C\u8F6C\u6362\u6210\u67E5\u8BE2\u5B57\u7B26\u4E32\u3002"),n("li",null,"\u7531\u4E8EGET\u548CPOST\u7684 \u201Copen\u201D\u548C \u201Csend\u201D\u4E0D\u4E00\u6837\uFF0C\u6240\u4EE5\u5224\u65AD\uFF0C\u7136\u540E\u5206\u5F00\u5199\u3002"),n("li",null,"\u4F18\u5316\uFF08\u9ED8\u8BA4GET\u3001\u5927\u5C0F\u5199\u7B49\u7B49\uFF09\u3002")])])],-1),Ys=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// \u8C03\u7528"),s(`
  `),n("span",{class:"token function"},"ajax"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),s(`
      url`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/getbooks'"),n("span",{class:"token punctuation"},","),s(`
      type`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'get'"),n("span",{class:"token punctuation"},","),s(`
      data`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(" id"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"1"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(`
      `),n("span",{class:"token function-variable function"},"success"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"res"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("res"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  
  `),n("span",{class:"token comment"},"// \u5C01\u88C5\u539F\u751F Js \u65B9\u6CD5"),s(`
  `),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token function"},"ajax"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"option"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
  
      `),n("span",{class:"token comment"},"// 1.\u5C06\u5BF9\u8C61\u53C2\u6570 \u8F6C\u6210 \u76F8\u5E94\u683C\u5F0F\u7684\u5B57\u7B26\u4E32"),s(`
      `),n("span",{class:"token keyword"},"var"),s(" params "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token function"},"objectToString"),n("span",{class:"token punctuation"},"("),s("option"),n("span",{class:"token punctuation"},"."),s("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token keyword"},"var"),s(" type "),n("span",{class:"token operator"},"="),s(" option"),n("span",{class:"token punctuation"},"."),s("type"),n("span",{class:"token punctuation"},";"),s(`
  
      `),n("span",{class:"token keyword"},"var"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onload"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("status "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"200"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
              console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  
      `),n("span",{class:"token comment"},"// \u5224\u65AD\u7C7B\u578B\uFF0C\u8FD4\u56DE"),s(`
      `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("type "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token string"},"'get'"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),s("type"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),s("option"),n("span",{class:"token punctuation"},"."),s("url"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"},"?"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),s("params"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(),n("span",{class:"token keyword"},"else"),s(),n("span",{class:"token punctuation"},"{"),s(`
          xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),s("type"),n("span",{class:"token punctuation"},","),s(" option"),n("span",{class:"token punctuation"},"."),s("url"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),s("params"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  
  `),n("span",{class:"token punctuation"},"}"),s(`
  
  `),n("span",{class:"token comment"},"// \u8BF7\u6C42\u53C2\u6570"),s(`
  `),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token function"},"objectToString"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"data"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token keyword"},"var"),s(" list "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token keyword"},"for"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"var"),s(" key "),n("span",{class:"token keyword"},"in"),s(" data"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          list`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),s("key"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"},"="),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),s("data"),n("span",{class:"token punctuation"},"["),s("key"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  	
      `),n("span",{class:"token keyword"},"return"),s(" list"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"join"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'&'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br"),n("span",{class:"line-number"},"22"),n("br"),n("span",{class:"line-number"},"23"),n("br"),n("span",{class:"line-number"},"24"),n("br"),n("span",{class:"line-number"},"25"),n("br"),n("span",{class:"line-number"},"26"),n("br"),n("span",{class:"line-number"},"27"),n("br"),n("span",{class:"line-number"},"28"),n("br"),n("span",{class:"line-number"},"29"),n("br"),n("span",{class:"line-number"},"30"),n("br"),n("span",{class:"line-number"},"31"),n("br"),n("span",{class:"line-number"},"32"),n("br"),n("span",{class:"line-number"},"33"),n("br"),n("span",{class:"line-number"},"34"),n("br"),n("span",{class:"line-number"},"35"),n("br"),n("span",{class:"line-number"},"36"),n("br"),n("span",{class:"line-number"},"37"),n("br"),n("span",{class:"line-number"},"38"),n("br"),n("span",{class:"line-number"},"39"),n("br"),n("span",{class:"line-number"},"40"),n("br"),n("span",{class:"line-number"},"41"),n("br"),n("span",{class:"line-number"},"42"),n("br"),n("span",{class:"line-number"},"43"),n("br"),n("span",{class:"line-number"},"44"),n("br"),n("span",{class:"line-number"},"45"),n("br")])],-1),Zs=n("h3",{id:"readystate-\u5C5E\u6027",tabindex:"-1"},[s("readyState \u5C5E\u6027 "),n("a",{class:"header-anchor",href:"#readystate-\u5C5E\u6027","aria-hidden":"true"},"#")],-1),na=n("blockquote",null,[n("p",null,"Ajax \u4ECE\u521B\u5EFA xhr \u5BF9\u8C61\u5F00\u59CB\uFF0C\u4E00\u76F4\u5230\u5B8C\u5168\u63A5\u6536\u670D\u52A1\u5668\u8FD4\u56DE\u7684\u7ED3\u679C\u4E3A\u6B62\uFF1B\u6211\u4EEC\u53EF\u4EE5\u628A\u6574\u4E2A\u8BF7\u6C42\u54CD\u5E94\u8FC7\u7A0B\u5212\u5206\u4E3A5\u4E2A\u9636\u6BB5\u3002\u5E76\u4E14\u53EF\u4EE5\u4F7F\u7528 xhr.readyState \u5C5E\u6027\u68C0\u6D4B\u5F53\u524D\u8BF7\u6C42\u6267\u884C\u5230\u54EA\u4E2A\u9636\u6BB5\u4E86\u3002")],-1),sa=n("p",null,"readyState \u5C5E\u6027\u503C\u4E3A\u4E00\u4E2A\u6570\u5B57\uFF0C\u4E0D\u540C\u7684\u6570\u5B57\u8868\u793AAjax\u7684\u4E0D\u540C\u72B6\u6001\u3002",-1),aa=n("table",null,[n("thead",null,[n("tr",null,[n("th",{style:{"text-align":"center"}},"\u5C5E\u6027\u503C"),n("th",{style:{"text-align":"center"}},"\u72B6\u6001")])]),n("tbody",null,[n("tr",null,[n("td",{style:{"text-align":"center"}},"xhr.readyState === 0"),n("td",{style:{"text-align":"center"}},"\u521D\u59CB\u72B6\u6001\uFF0C\u8868\u793A xhr \u5BF9\u8C61\u4E00\u5B9A\u521B\u5EFA\u4E86")]),n("tr",null,[n("td",{style:{"text-align":"center"}},"xhr.readyState === 1"),n("td",{style:{"text-align":"center"}},"\u8868\u793A open \u4E00\u5B9A\u8C03\u7528\u4E86")]),n("tr",null,[n("td",{style:{"text-align":"center"}},"xhr.readyState === 2"),n("td",{style:{"text-align":"center"}},"\u8868\u793A send \u4E00\u5B9A\u8C03\u7528\u4E86\uFF0C\u5E76\u4E14\u5DF2\u7ECF\u63A5\u6536\u5230\u54CD\u5E94\u5934")]),n("tr",null,[n("td",{style:{"text-align":"center"}},"xhr.readyState === 3"),n("td",{style:{"text-align":"center"}},"\u8868\u793A\u6B63\u5728\u63A5\u6536\u670D\u52A1\u5668\u8FD4\u56DE\u7684\u6570\u636E\uFF08\u53EF\u80FD\u5DF2\u63A5\u6536\u5B8C\u6BD5\uFF0C\u4E5F\u53EF\u80FD\u6B63\u5728\u63A5\u6536\u4E2D\uFF0C\u53D6\u51B3\u4E8E\u6570\u636E\u91CF\u7684\u5927\u5C0F\uFF09")]),n("tr",null,[n("td",{style:{"text-align":"center"}},[n("strong",null,"xhr.readyState === 4")]),n("td",{style:{"text-align":"center"}},[n("strong",null,"\u8868\u793A Ajax \u8BF7\u6C42\u54CD\u5E94\u8FC7\u7A0B\u5B8C\u6210")])])])],-1),ta=n("p",null,[n("img",{src:v,alt:"image-20210414114934520"})],-1),ea=n("h2",{id:"status-\u5C5E\u6027",tabindex:"-1"},[s("status \u5C5E\u6027 "),n("a",{class:"header-anchor",href:"#status-\u5C5E\u6027","aria-hidden":"true"},"#")],-1),oa=n("blockquote",null,[n("p",null,"status \u5C5E\u6027\u8868\u793A http \u72B6\u6001\u7801\uFF0C\u662F\u4E00\u4E2A\u6570\u5B57\uFF0C\u4EE3\u7801\u6307\u793A\u7279\u5B9A HTTP \u8BF7\u6C42\u662F\u5426\u5DF2\u6210\u529F\u5B8C\u6210\u3002")],-1),ca=n("p",null,"\u76F8\u5E94\u5206\u7C7B\uFF1A",-1),la=n("ul",null,[n("li",null,"\u4FE1\u606F\u54CD\u5E94(100\u2013199)"),n("li",null,"\u6210\u529F\u54CD\u5E94(200\u2013299)"),n("li",null,"\u91CD\u5B9A\u5411(300\u2013399)"),n("li",null,"\u5BA2\u6237\u7AEF\u9519\u8BEF(400\u2013499)"),n("li",null,"\u670D\u52A1\u5668\u9519\u8BEF (500\u2013599)")],-1),pa=n("p",null,"\u5E38\u7528\u72B6\u6001\u7801\uFF1A",-1),ua=n("ul",null,[n("li",null,"200 OK - \u8BF7\u6C42\u6210\u529F"),n("li",null,"400 Bad Request - 1\u3001\u8BED\u4E49\u6709\u8BEF\uFF0C\u5F53\u524D\u8BF7\u6C42\u65E0\u6CD5\u88AB\u670D\u52A1\u5668\u7406\u89E3\u30022\u3001\u8BF7\u6C42\u53C2\u6570\u6709\u8BEF\u3002"),n("li",null,"401 Unauthorized - \u5F53\u524D\u8BF7\u6C42\u9700\u8981\u7528\u6237\u9A8C\u8BC1\u3002"),n("li",null,"404 Not Found - \u8BF7\u6C42\u5931\u8D25\uFF0C\u8BF7\u6C42\u6240\u5E0C\u671B\u5F97\u5230\u7684\u8D44\u6E90\u672A\u88AB\u5728\u670D\u52A1\u5668\u4E0A\u53D1\u73B0\u3002"),n("li",null,"500 Internal Server Error - \u670D\u52A1\u5668\u9047\u5230\u4E86\u4E0D\u77E5\u9053\u5982\u4F55\u5904\u7406\u7684\u60C5\u51B5\u3002")],-1),ia=n("h2",{id:"url-\u7F16\u7801\u89E3\u7801",tabindex:"-1"},[s("URL \u7F16\u7801\u89E3\u7801 "),n("a",{class:"header-anchor",href:"#url-\u7F16\u7801\u89E3\u7801","aria-hidden":"true"},"#")],-1),ra=n("blockquote",null,[n("p",null,"\u628A\u4E2D\u6587\u548C\u90E8\u5206\u7279\u6B8A\u7B26\u53F7\u8F6C\u6210 URL \u7684\u6807\u51C6\u683C\u5F0F\uFF0C\u8FD9\u5C31\u662F url \u7F16\u7801\u3002"),n("p",null,"\u4F5C\u7528\uFF1A\u89E3\u51B3\u4E71\u7801\u95EE\u9898\u3002")],-1),ka=n("h3",{id:"\u7F16\u7801",tabindex:"-1"},[s("\u7F16\u7801 "),n("a",{class:"header-anchor",href:"#\u7F16\u7801","aria-hidden":"true"},"#")],-1),ba=n("blockquote",null,[n("p",null,"encodeURIComponent()")],-1),ma=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token keyword"},"var"),s(" name "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token string"},"'\u5F20\u4E09'"),n("span",{class:"token punctuation"},";"),s(`
  
  `),n("span",{class:"token keyword"},"var"),s(" r "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token function"},"encodeURIComponent"),n("span",{class:"token punctuation"},"("),s("name"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("r"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s("		"),n("span",{class:"token comment"},'// "%E5%BC%A0%E4%B8%89"'),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br")])],-1),da=n("h3",{id:"\u89E3\u7801",tabindex:"-1"},[s("\u89E3\u7801 "),n("a",{class:"header-anchor",href:"#\u89E3\u7801","aria-hidden":"true"},"#")],-1),ha=n("blockquote",null,[n("p",null,"decodeURIComponent()")],-1),ga=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token keyword"},"var"),s(" r "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token string"},'"%E5%BC%A0%E4%B8%89"'),n("span",{class:"token punctuation"},";"),s(`
  
  console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s(),n("span",{class:"token function"},"decodeURIComponent"),n("span",{class:"token punctuation"},"("),s("r"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s("	"),n("span",{class:"token comment"},"// \u5F20\u4E09"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br")])],-1),fa=n("h2",{id:"xmlhttprequest-level-2",tabindex:"-1"},[s("XMLHttpRequest level 2 "),n("a",{class:"header-anchor",href:"#xmlhttprequest-level-2","aria-hidden":"true"},"#")],-1),_a=n("blockquote",null,[n("p",null,"XHR 2.0 \u5BF9XMLHttpRequest\u8FDB\u884C\u4E86\u6269\u5C55\u3002")],-1),va=n("h3",{id:"timeout-\u8BF7\u6C42\u8D85\u65F6\u9650\u5236\u8BBE\u7F6E",tabindex:"-1"},[s("timeout \u8BF7\u6C42\u8D85\u65F6\u9650\u5236\u8BBE\u7F6E "),n("a",{class:"header-anchor",href:"#timeout-\u8BF7\u6C42\u8D85\u65F6\u9650\u5236\u8BBE\u7F6E","aria-hidden":"true"},"#")],-1),wa=n("blockquote",null,[n("p",null,"timeout \u548C ontimeout")],-1),xa=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// 1.\u8BBE\u7F6E\u8BF7\u6C42\u8D85\u65F6\u65F6\u95F4\uFF0C\u5355\u4F4D\u662F\u6BEB\u79D2"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),s("timeout "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token number"},"30"),n("span",{class:"token punctuation"},";"),s(`
  
  `),n("span",{class:"token comment"},"// 2.\u8BBE\u7F6E\u8D85\u65F6\u8FD4\u56DE\u7684\u5185\u5BB9"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"ontimeout"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'\u8BF7\u6C42\u8D85\u65F6\u4E86'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br")])],-1),ya=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// 1.\u521B\u5EFA xhr \u5BF9\u8C61"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token comment"},"// 2.\u8BBE\u7F6E\u8BF7\u6C42\u65B9\u5F0F"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'get'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/getbooks'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token comment"},"// 3.\u53D1\u9001\u8BF7\u6C42"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  `),n("span",{class:"token comment"},"// 4.\u8BBE\u7F6E\u8BF7\u6C42\u8D85\u65F6\u65F6\u95F4\uFF0C\u5355\u4F4D\u662F\u6BEB\u79D2"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),s("timeout "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token number"},"1000"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token comment"},"// 5.\u8BBE\u7F6E\u8D85\u65F6\u8FD4\u56DE\u7684\u5185\u5BB9"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"ontimeout"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'\u8BF7\u6C42\u8D85\u65F6\u4E86'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  
  `),n("span",{class:"token comment"},"// 6.\u76D1\u542C"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onreadystatechange"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("readyState "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"4"),s(),n("span",{class:"token operator"},"&&"),s(" xhr"),n("span",{class:"token punctuation"},"."),s("status "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"200"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br")])],-1),ja=n("h3",{id:"onload-\u4E8B\u4EF6",tabindex:"-1"},[s("onload \u4E8B\u4EF6 "),n("a",{class:"header-anchor",href:"#onload-\u4E8B\u4EF6","aria-hidden":"true"},"#")],-1),qa=n("blockquote",null,[n("p",null,[s("onload \u4E8B\u4EF6\uFF0C\u5176\u4F60\u53BB\u6210\u529F\u65F6\u89E6\u53D1\uFF0C"),n("strong",null,"\u53EF\u4EE5\u4EE3\u66FF onreadystatechange \u4E8B\u4EF6\u3002")]),n("p",null,[n("strong",null,"\u4F7F\u7528 onload \u4EE3\u66FF onreadystatechange\uFF0C\u91CC\u9762\u4E0D\u7528\u52A0\u5224\u65AD\uFF0C\u56E0\u4E3A onload \u672C\u8EAB\u5C31\u662F\u5728\u8BF7\u6C42\u6210\u529F\u65F6\u89E6\u53D1\u7684\u3002")])],-1),Sa=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("xhr"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onload"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token comment"},"// \u6210\u529F\u54CD\u5E94\u540E\uFF0C\u83B7\u53D6\u54CD\u5E94\u7ED3\u679C"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"this"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br")])],-1),Ta=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// 1.\u521B\u5EFA xhr \u5BF9\u8C61"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token comment"},"// 2.\u8BBE\u7F6E\u8BF7\u6C42\u65B9\u5F0F"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'get'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/getbooks'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token comment"},"// 3.\u53D1\u9001\u8BF7\u6C42"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  `),n("span",{class:"token comment"},"// 4.\u8BBE\u7F6E\u8BF7\u6C42\u8D85\u65F6\u65F6\u95F4\uFF0C\u5355\u4F4D\u662F\u6BEB\u79D2"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),s("timeout "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token number"},"1000"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token comment"},"// 5.\u8BBE\u7F6E\u8D85\u65F6\u8FD4\u56DE\u7684\u5185\u5BB9"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"ontimeout"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'\u8BF7\u6C42\u8D85\u65F6\u4E86'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  
  `),n("span",{class:"token comment"},"// 6.\u76D1\u542C"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onload"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token comment"},"// \u6210\u529F\u54CD\u5E94\u540E\uFF0C\u83B7\u53D6\u54CD\u5E94\u7ED3\u679C"),s(`
      `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("status "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"200"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"this"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br")])],-1),Da=n("h3",{id:"onerror-\u4E8B\u4EF6",tabindex:"-1"},[s("onerror \u4E8B\u4EF6 "),n("a",{class:"header-anchor",href:"#onerror-\u4E8B\u4EF6","aria-hidden":"true"},"#")],-1),Na=n("blockquote",null,[n("p",null,[s("\u5728\u8BF7\u6C42\u5931\u8D25\u65F6\u89E6\u53D1\u3002"),n("strong",null,"\u65AD\u7F51\u60C5\u51B5\u4E0B\u89E6\u53D1\u3002")])],-1),La=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("xhr"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onerror"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'\u8BF7\u6C42\u5931\u8D25\uFF0C\u8BF7\u68C0\u67E5\u5F53\u524D\u7F51\u7EDC\u73AF\u5883'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br")])],-1),Oa=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// 1.\u521B\u5EFA xhr \u5BF9\u8C61"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token comment"},"// 2.\u8BBE\u7F6E\u8BF7\u6C42\u65B9\u5F0F"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'get'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/getbooks'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token comment"},"// 3.\u53D1\u9001\u8BF7\u6C42"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  `),n("span",{class:"token comment"},"// 4.\u76D1\u542C"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onload"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token comment"},"// \u6210\u529F\u54CD\u5E94\u540E\uFF0C\u83B7\u53D6\u54CD\u5E94\u7ED3\u679C"),s(`
      `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("status "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"200"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  
  `),n("span",{class:"token comment"},"// 5.\u8BF7\u6C42\u5931\u8D25"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onerror"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'\u8BF7\u6C42\u5931\u8D25\uFF0C\u8BF7\u68C0\u67E5\u5F53\u524D\u7F51\u7EDC\u73AF\u5883'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br")])],-1),Ja=n("h3",{id:"onprogress-\u4E8B\u4EF6",tabindex:"-1"},[s("onprogress \u4E8B\u4EF6 "),n("a",{class:"header-anchor",href:"#onprogress-\u4E8B\u4EF6","aria-hidden":"true"},"#")],-1),Ea=n("blockquote",null,[n("p",null,[s("\u5728\u8BF7\u6C42\u5B8C\u6210\u4E4B\u524D\u5468\u671F\u6027\u8C03\u7528\u7684\u51FD\u6570\u3002"),n("strong",null,"readyState \u4E3A 3 \u65F6\u89E6\u53D1\u3002")]),n("p",null,[n("strong",null,"\u4F5C\u7528\uFF1A\u53EF\u4EE5\u4F7F\u7528 onprogress \u4E8B\u4EF6\uFF0C\u83B7\u53D6\u6570\u636E\u7684\u63A5\u6536\uFF08\u4E0B\u8F7D\uFF09\u8FDB\u5EA6\u3002")])],-1),Pa=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("xhr"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onprogress"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"event"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token comment"},"// \u5DF2\u4F20\u8F93\u7684\u6570\u636E\u91CF"),s(`
      event`),n("span",{class:"token punctuation"},"."),s("loaded"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token comment"},"// \u603B\u5171\u7684\u6570\u636E\u91CF"),s(`
      event`),n("span",{class:"token punctuation"},"."),s("total"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br")])],-1),Ca=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// 1.\u521B\u5EFA xhr \u5BF9\u8C61"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token comment"},"// 2.\u8BBE\u7F6E\u8BF7\u6C42\u65B9\u5F0F"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'get'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/getbooks'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token comment"},"// 3.\u53D1\u9001\u8BF7\u6C42"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  `),n("span",{class:"token comment"},"// 4.\u76D1\u542C"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onload"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token comment"},"// \u6210\u529F\u54CD\u5E94\u540E\uFF0C\u83B7\u53D6\u54CD\u5E94\u7ED3\u679C"),s(`
      `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("status "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"200"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  
  `),n("span",{class:"token comment"},"// 5.\u8BF7\u6C42\u5931\u8D25"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onerror"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'\u8BF7\u6C42\u5931\u8D25\uFF0C\u8BF7\u68C0\u67E5\u5F53\u524D\u7F51\u7EDC\u73AF\u5883'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  
  `),n("span",{class:"token comment"},"// 6.\u8FDB\u5EA6"),s(`
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onprogress"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"event"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token comment"},"// \u5DF2\u4F20\u8F93\u7684\u6570\u636E\u91CF"),s(`
      event`),n("span",{class:"token punctuation"},"."),s("loaded"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token comment"},"// \u603B\u5171\u7684\u6570\u636E\u91CF"),s(`
      event`),n("span",{class:"token punctuation"},"."),s("total"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br"),n("span",{class:"line-number"},"22"),n("br"),n("span",{class:"line-number"},"23"),n("br"),n("span",{class:"line-number"},"24"),n("br"),n("span",{class:"line-number"},"25"),n("br"),n("span",{class:"line-number"},"26"),n("br"),n("span",{class:"line-number"},"27"),n("br")])],-1),Ha=n("h3",{id:"onloadstart-\u4E8B\u4EF6",tabindex:"-1"},[s("onloadstart \u4E8B\u4EF6 "),n("a",{class:"header-anchor",href:"#onloadstart-\u4E8B\u4EF6","aria-hidden":"true"},"#")],-1),Ma=n("blockquote",null,[n("p",null,"\u4E0B\u8F7D\u6570\u636E\u4E4B\u524D\u89E6\u53D1\u3002"),n("p",null,[n("strong",null,"\u653E\u5728 open \u548C send \u4E4B\u95F4\u3002")])],-1),Ra=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("xhr"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onloadstart"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'\u4E0B\u8F7D\u6570\u636E\u4E4B\u524D'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br")])],-1),Aa=n("h3",{id:"onloadend-\u4E8B\u4EF6",tabindex:"-1"},[s("onloadend \u4E8B\u4EF6 "),n("a",{class:"header-anchor",href:"#onloadend-\u4E8B\u4EF6","aria-hidden":"true"},"#")],-1),$a=n("blockquote",null,[n("p",null,"\u4E0B\u8F7D\u6570\u636E\u5B8C\u6210\u4E4B\u540E\u9700\u89E6\u53D1\u3002"),n("p",null,[n("strong",null,"\u653E\u5728 open \u548C send \u4E4B\u95F4\u3002")])],-1),Xa=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("xhr"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onloadend"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'\u4E0B\u8F7D\u6570\u636E\u5B8C\u6210\u4E4B\u540E'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br")])],-1),Ia=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token keyword"},"let"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'get'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/getbooks'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onloadstart"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'\u4E0B\u8F7D\u6570\u636E\u4E4B\u524D'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onload"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("status "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"200"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onloadend"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'\u4E0B\u8F7D\u6570\u636E\u5B8C\u6210\u4E4B\u540E\u89E6\u53D1'"),n("span",{class:"token punctuation"},")"),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br")])],-1),Fa=n("h2",{id:"formdata-\u5BF9\u8C61",tabindex:"-1"},[s("FormData \u5BF9\u8C61 "),n("a",{class:"header-anchor",href:"#formdata-\u5BF9\u8C61","aria-hidden":"true"},"#")],-1),Ua=n("blockquote",null,[n("p",null,[s("h5\u51FA\u73B0\u4E4B\u540E\uFF0C\u65B0\u589E\u7684\u4E00\u4E2A\u5BF9\u8C61\u3002"),n("strong",null,"\u7528\u4E8E\u7BA1\u7406\u8868\u5355\u6570\u636E\u3002")]),n("p",null,"\u521B\u5EFA FormData \u5BF9\u8C61\uFF0C\u53EF\u76F4\u63A5\u901A\u8FC7 xhr.send (FormData\u5BF9\u8C61) \u63D0\u4EA4\u7ED9\u670D\u52A1\u5668\u7684\u63A5\u53E3\u3002")],-1),Ga=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// \u83B7\u53D6\u5143\u7D20"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" form "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'form'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  `),n("span",{class:"token comment"},"// \u5B9E\u4F8B\u5316 formData \u5BF9\u8C61\uFF0C\u4F20\u5165form"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" formData "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"FormData"),n("span",{class:"token punctuation"},"("),s("form"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'post'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'\u8981\u63D0\u4EA4\u7684\u5730\u5740'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),s("formData"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br")])],-1),Ba=n("p",null,[n("strong",null,"==\u521B\u5EFA\u8868\u5355\u65F6\uFF0C\u4E00\u5B9A\u8981\u8BBE\u7F6E name \u5C5E\u6027\uFF0C\u4F20\u6570\u636E\u65F6\u8981\u4F7F\u7528 name \u5C5E\u6027\u5F53\u505A \u952E\u540D \u6765\u4F7F\u7528\u3002==")],-1),za=n("blockquote",null,[n("p",null,"name \u503C\u662F\u4EC0\u4E48\uFF0C\u952E\u540D\u5C31\u662F\u4EC0\u4E48\u3002"),n("p",null,[n("img",{src:w,alt:"image-20210419111628466"})])],-1),Wa=n("div",{class:"language-html line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("html")]),n("span",{class:"token punctuation"},">")]),s(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("body")]),n("span",{class:"token punctuation"},">")]),s(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("form")]),n("span",{class:"token punctuation"},">")]),s(`
              `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("input")]),s(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("text"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"name"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("username"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"id"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("username"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token punctuation"},">")]),s(`
              `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("input")]),s(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("password"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"name"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("pwd"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"id"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("pwd"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token punctuation"},">")]),s(`
              `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("input")]),s(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("button"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"id"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("btn"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token punctuation"},">")]),s(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("form")]),n("span",{class:"token punctuation"},">")]),s(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("body")]),n("span",{class:"token punctuation"},">")]),s(`
      
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(`
          `),n("span",{class:"token comment"},"// \u83B7\u53D6\u5143\u7D20"),s(`
          `),n("span",{class:"token keyword"},"let"),s(" form "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'form'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          `),n("span",{class:"token keyword"},"let"),s(" btn "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'#btn'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          
      	btn`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"addEventListener"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'click'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"event"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
              `),n("span",{class:"token keyword"},"let"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
              
              `),n("span",{class:"token comment"},"// \u5B9E\u4F8B\u5316 formData \u5BF9\u8C61\uFF0C\u4F20\u5165form"),s(`
              `),n("span",{class:"token keyword"},"let"),s(" formData "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"FormData"),n("span",{class:"token punctuation"},"("),s("form"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
              
              xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'post'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'http://121.5.153.184:3000/formData'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
              xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onload"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
                  `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("status "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"200"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
                      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
                  `),n("span",{class:"token punctuation"},"}"),s(`
              `),n("span",{class:"token punctuation"},"}"),s(`
              
              `),n("span",{class:"token comment"},"// \u63D0\u4EA4\u6570\u636E"),s(`
              xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),s("formData"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("script")]),n("span",{class:"token punctuation"},">")]),s(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("html")]),n("span",{class:"token punctuation"},">")]),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br"),n("span",{class:"line-number"},"22"),n("br"),n("span",{class:"line-number"},"23"),n("br"),n("span",{class:"line-number"},"24"),n("br"),n("span",{class:"line-number"},"25"),n("br"),n("span",{class:"line-number"},"26"),n("br"),n("span",{class:"line-number"},"27"),n("br"),n("span",{class:"line-number"},"28"),n("br"),n("span",{class:"line-number"},"29"),n("br"),n("span",{class:"line-number"},"30"),n("br"),n("span",{class:"line-number"},"31"),n("br"),n("span",{class:"line-number"},"32"),n("br"),n("span",{class:"line-number"},"33"),n("br")])],-1),Qa=n("h3",{id:"api-\u65B9\u6CD5",tabindex:"-1"},[s("API \u65B9\u6CD5 "),n("a",{class:"header-anchor",href:"#api-\u65B9\u6CD5","aria-hidden":"true"},"#")],-1),Va=n("h4",{id:"append-\u65B9\u6CD5",tabindex:"-1"},[s("append \u65B9\u6CD5 "),n("a",{class:"header-anchor",href:"#append-\u65B9\u6CD5","aria-hidden":"true"},"#")],-1),Ka=n("blockquote",null,[n("p",null,[n("strong",null,"\u5411\u5BF9\u8C61\u4E2D\u8FFD\u52A0\u6570\u636E\u3002")]),n("blockquote",null,[n("p",null,"\u4F1A\u8FFD\u52A0\u4E00\u4E2A\u81EA\u5B9A\u4E49\u7684\u5C5E\u6027\u3002")]),n("blockquote",null,[n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("formData"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"append"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'key'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'value'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br")])])]),n("blockquote",null,[n("p",null,[n("img",{src:x,alt:"image-20210419115013142"})])])],-1),Ya=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// \u83B7\u53D6\u5143\u7D20"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" form "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'form'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" btn "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'#btn'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  btn`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"addEventListener"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'click'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"event"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token keyword"},"let"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
      `),n("span",{class:"token comment"},"// \u5B9E\u4F8B\u5316 formData \u5BF9\u8C61\uFF0C\u4F20\u5165form"),s(`
      `),n("span",{class:"token keyword"},"let"),s(" formData "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"FormData"),n("span",{class:"token punctuation"},"("),s("form"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      
      formData`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"append"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'age'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token number"},"18"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'post'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'http://121.5.153.184:3000/formData'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onload"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("status "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"200"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
              console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  
      `),n("span",{class:"token comment"},"// \u63D0\u4EA4\u6570\u636E"),s(`
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),s("formData"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br"),n("span",{class:"line-number"},"22"),n("br"),n("span",{class:"line-number"},"23"),n("br")])],-1),Za=n("h4",{id:"set-\u65B9\u6CD5",tabindex:"-1"},[s("set \u65B9\u6CD5 "),n("a",{class:"header-anchor",href:"#set-\u65B9\u6CD5","aria-hidden":"true"},"#")],-1),nt=n("blockquote",null,[n("p",null,[n("strong",null,"\u4FEE\u6539\u5BF9\u8C61\u4E2D\u7684\u6570\u636E\u3002")]),n("p",null,[n("strong",null,"==\u6709\u540C\u540D\u5C5E\u6027\uFF0C\u5219\u4FEE\u6539\u8BE5\u5C5E\u6027\u7684\u503C\uFF1B\u6CA1\u6709\u540C\u540D\u5C5E\u6027\uFF0C\u5219\u65B0\u589E\u8BE5\u5C5E\u6027\u3002==")]),n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("formData"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"set"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'key'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'value'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br")])]),n("p",null,[n("img",{src:y,alt:"image-20210419115142833"})])],-1),st=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// \u83B7\u53D6\u5143\u7D20"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" form "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'form'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" btn "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'#btn'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  btn`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"addEventListener"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'click'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"event"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
  
      `),n("span",{class:"token comment"},"// \u5B9E\u4F8B\u5316 formData \u5BF9\u8C61\uFF0C\u4F20\u5165form"),s(`
      `),n("span",{class:"token keyword"},"let"),s(" formData "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"FormData"),n("span",{class:"token punctuation"},"("),s("form"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      
      formData`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"set"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'username'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'\u674E\u56DB'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
      `),n("span",{class:"token keyword"},"let"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'post'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'http://121.5.153.184:3000/formData'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onload"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("status "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"200"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
              console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token comment"},"// \u63D0\u4EA4\u6570\u636E"),s(`
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),s("formData"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br")])],-1),at=n("h4",{id:"delete-\u65B9\u6CD5",tabindex:"-1"},[s("delete \u65B9\u6CD5 "),n("a",{class:"header-anchor",href:"#delete-\u65B9\u6CD5","aria-hidden":"true"},"#")],-1),tt=n("blockquote",null,[n("p",null,"\u4ECE\u5BF9\u8C61\u4E2D\u5220\u9664\u6570\u636E\u3002"),n("p",null,"\u5220\u9664\u6307\u5B9A\u7684\u5C5E\u6027\u3002"),n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("formData"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"delect"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'key'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br")])]),n("p",null,[n("img",{src:j,alt:"image-20210419173652501"})])],-1),et=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// \u83B7\u53D6\u5143\u7D20"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" form "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'form'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" btn "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'#btn'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  btn`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"addEventListener"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'click'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"event"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
  
      `),n("span",{class:"token comment"},"// \u5B9E\u4F8B\u5316 formData \u5BF9\u8C61\uFF0C\u4F20\u5165form"),s(`
      `),n("span",{class:"token keyword"},"let"),s(" formData "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"FormData"),n("span",{class:"token punctuation"},"("),s("form"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      
      formData`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"delete"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'username'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
      `),n("span",{class:"token keyword"},"let"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'post'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'http://121.5.153.184:3000/formData'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onload"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("status "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"200"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
              console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token comment"},"// \u63D0\u4EA4\u6570\u636E"),s(`
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),s("formData"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br")])],-1),ot=n("h4",{id:"get-\u65B9\u6CD5-1",tabindex:"-1"},[s("get \u65B9\u6CD5 "),n("a",{class:"header-anchor",href:"#get-\u65B9\u6CD5-1","aria-hidden":"true"},"#")],-1),ct=n("blockquote",null,[n("p",null,"\u83B7\u53D6\u6307\u5B9A key \u7684\u4E00\u9879\u6570\u636E\u3002"),n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("formData"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"get"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'key'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br")])]),n("p",null,[n("img",{src:q,alt:"image-20210419174149422"})])],-1),lt=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// \u83B7\u53D6\u5143\u7D20"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" form "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'form'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" btn "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'#btn'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  btn`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"addEventListener"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'click'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"event"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
  
      `),n("span",{class:"token comment"},"// \u5B9E\u4F8B\u5316 formData \u5BF9\u8C61\uFF0C\u4F20\u5165form"),s(`
      `),n("span",{class:"token keyword"},"let"),s(" formData "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"FormData"),n("span",{class:"token punctuation"},"("),s("form"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s(" formData"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"get"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'username'"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
      `),n("span",{class:"token keyword"},"let"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'post'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'http://121.5.153.184:3000/formData'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onload"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("status "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"200"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
              console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token comment"},"// \u63D0\u4EA4\u6570\u636E"),s(`
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),s("formData"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br")])],-1),pt=n("h4",{id:"getall-\u65B9\u6CD5",tabindex:"-1"},[s("getAll \u65B9\u6CD5 "),n("a",{class:"header-anchor",href:"#getall-\u65B9\u6CD5","aria-hidden":"true"},"#")],-1),ut=n("blockquote",null,[n("p",null,"\u83B7\u53D6\u6307\u5B9A key \u7684\u5168\u90E8\u6570\u636E\uFF0C\u8FD4\u56DE\u503C\u662F\u6570\u7EC4\u3002"),n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("formData"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"getAll"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'key'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br")])]),n("p",null,[n("img",{src:S,alt:"image-20210419174328879"})])],-1),it=n("h4",{id:"foreach-\u65B9\u6CD5",tabindex:"-1"},[s("forEach \u65B9\u6CD5 "),n("a",{class:"header-anchor",href:"#foreach-\u65B9\u6CD5","aria-hidden":"true"},"#")],-1),rt=n("blockquote",null,[n("p",null,"\u904D\u5386\u5BF9\u8C61\u4E2D\u7684\u6570\u636E\u3002"),n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("formData"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"forEach"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"item"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(`
  console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("item"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br")])]),n("p",null,[n("img",{src:T,alt:"image-20210419174515580"})])],-1),kt=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"// \u83B7\u53D6\u5143\u7D20"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" form "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'form'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token keyword"},"let"),s(" btn "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'#btn'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
  btn`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"addEventListener"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'click'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"event"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
  
      `),n("span",{class:"token comment"},"// \u5B9E\u4F8B\u5316 formData \u5BF9\u8C61\uFF0C\u4F20\u5165form"),s(`
      `),n("span",{class:"token keyword"},"let"),s(" formData "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"FormData"),n("span",{class:"token punctuation"},"("),s("form"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      
      formData`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"forEach"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"item"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("item"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  
      `),n("span",{class:"token keyword"},"let"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'post'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'http://121.5.153.184:3000/formData'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onload"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("status "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"200"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
              console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token comment"},"// \u63D0\u4EA4\u6570\u636E"),s(`
      xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),s("formData"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br"),n("span",{class:"line-number"},"22"),n("br"),n("span",{class:"line-number"},"23"),n("br")])],-1),bt=n("h2",{id:"\u6587\u4EF6\u4E0A\u4F20\u8FDB\u5EA6\u76D1\u542C",tabindex:"-1"},[s("\u6587\u4EF6\u4E0A\u4F20\u8FDB\u5EA6\u76D1\u542C "),n("a",{class:"header-anchor",href:"#\u6587\u4EF6\u4E0A\u4F20\u8FDB\u5EA6\u76D1\u542C","aria-hidden":"true"},"#")],-1),mt=n("p",null,"\u5F85\u8865\u5145",-1),dt=n("h2",{id:"cors-\u8DE8\u57DF\u8D44\u6E90\u5171\u4EAB",tabindex:"-1"},[s("CORS \u8DE8\u57DF\u8D44\u6E90\u5171\u4EAB "),n("a",{class:"header-anchor",href:"#cors-\u8DE8\u57DF\u8D44\u6E90\u5171\u4EAB","aria-hidden":"true"},"#")],-1),ht=n("p",null,"\u5F85\u8865\u5145",-1),gt=n("h2",{id:"json",tabindex:"-1"},[s("JSON "),n("a",{class:"header-anchor",href:"#json","aria-hidden":"true"},"#")],-1),ft=n("blockquote",null,[n("p",null,"\u672C\u8D28\u662F\u5B57\u7B26\u4E32\uFF0C\u7ED3\u6784\u548C\u5BF9\u8C61\u5DEE\u4E0D\u591A\u3002"),n("p",null,"\u952E\u540D\u5FC5\u987B\u8981\u52A0\u53CC\u5F15\u53F7\uFF0C\u4E0D\u80FD\u5199 \u51FD\u6570 \u3001null \u548C undefined\u3002")],-1),_t=n("div",{class:"language-json line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token property"},'"name"'),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},'"\u5F20\u4E09"'),n("span",{class:"token punctuation"},","),s(`
      `),n("span",{class:"token property"},'"age"'),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"18"),n("span",{class:"token punctuation"},","),s(`
      `),n("span",{class:"token property"},'"arr"'),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"10"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token number"},"20"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token number"},"30"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token number"},"40"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(`
      `),n("span",{class:"token property"},'"bl"'),n("span",{class:"token operator"},":"),s(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br")])],-1),vt=n("h3",{id:"json\u5B57\u7B26\u4E32\u548Cjs\u6570\u636E\u8F6C\u6362",tabindex:"-1"},[s("JSON\u5B57\u7B26\u4E32\u548CJS\u6570\u636E\u8F6C\u6362 "),n("a",{class:"header-anchor",href:"#json\u5B57\u7B26\u4E32\u548Cjs\u6570\u636E\u8F6C\u6362","aria-hidden":"true"},"#")],-1),wt=n("blockquote",null,[n("p",null,"JS ----> JSON\uFF08\u5E8F\u5217\u5316\uFF09\uFF1AJSON.stringify( JS\u6570\u636E );"),n("p",null,"JSON ----> JS \uFF08\u53CD\u5E8F\u5217\u5316\uFF09\uFF1AJSON.parse( JSON\u5B57\u7B26\u4E32 );")],-1),xt=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token keyword"},"var"),s(" data "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token string"},'"name"'),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},'"\u5F20\u4E09"'),n("span",{class:"token punctuation"},","),s(`
      `),n("span",{class:"token string"},'"age"'),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"18"),n("span",{class:"token punctuation"},","),s(`
      `),n("span",{class:"token string"},'"arr"'),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"10"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token number"},"20"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token number"},"30"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token number"},"40"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(`
      `),n("span",{class:"token string"},'"bl"'),n("span",{class:"token operator"},":"),s(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),s(`
  `),n("span",{class:"token punctuation"},"}"),s(`
  
  `),n("span",{class:"token comment"},"// js \u6570\u636E\u5E8F\u5217\u5316\u4E3A\u5B57\u7B26\u4E32"),s(`
  `),n("span",{class:"token keyword"},"var"),s(" jsonStr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"stringify"),n("span",{class:"token punctuation"},"("),s("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token comment"},'// \u7ED3\u679C\uFF1A"{"name":"\u5F20\u4E09","age":18,"arr":[10,20,30,40],"bl":true}"'),s(`
  
  `),n("span",{class:"token comment"},"// \u53CD\u5E8F\u5217\u5316\u6210\u5BF9\u8C61"),s(`
  `),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("jsonStr"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br")])],-1),yt=n("h2",{id:"\u57FA\u4E8E-http-\u5E93-\u7684\u63A5\u53E3\uFF08mock-js\u3001fetch\u3001axios\uFF09",tabindex:"-1"},[s("\u57FA\u4E8E HTTP \u5E93 \u7684\u63A5\u53E3\uFF08Mock.js\u3001Fetch\u3001axios\uFF09 "),n("a",{class:"header-anchor",href:"#\u57FA\u4E8E-http-\u5E93-\u7684\u63A5\u53E3\uFF08mock-js\u3001fetch\u3001axios\uFF09","aria-hidden":"true"},"#")],-1),jt=n("h3",{id:"mock-js-\u63A5\u53E3",tabindex:"-1"},[s("Mock.js \u63A5\u53E3 "),n("a",{class:"header-anchor",href:"#mock-js-\u63A5\u53E3","aria-hidden":"true"},"#")],-1),qt=n("blockquote",null,[n("p",null,[s("\u5B98\u7F51\u5730\u5740\uFF1A"),n("a",{href:"http://www.mockjs.com",target:"_blank",rel:"noopener noreferrer"},"www.mockjs.com")]),n("p",null,"Mock.js \u662F\u4E00\u6B3E\u6A21\u62DF\u6570\u636E\u751F\u6210\u5668\uFF0C\u65E8\u5728\u5E2E\u52A9\u524D\u7AEF\u653B\u57CE\u5E08\u72EC\u7ACB\u4E8E\u540E\u7AEF\u8FDB\u884C\u5F00\u53D1\uFF0C\u5E2E\u52A9\u7F16\u5199\u5355\u5143\u6D4B\u8BD5\u3002"),n("p",null,[n("strong",null,"\u7B80\u5355\u7406\u89E3\uFF1A\u7B2C\u4E09\u65B9\u5E93\uFF0C\u89E3\u51B3\u6570\u636E\u6A21\u62DF\u95EE\u9898\u3002")])],-1),St=n("h4",{id:"\u5F15\u5165\u5E93",tabindex:"-1"},[s("\u5F15\u5165\u5E93 "),n("a",{class:"header-anchor",href:"#\u5F15\u5165\u5E93","aria-hidden":"true"},"#")],-1),Tt=n("blockquote",null,[n("p",null,[n("a",{href:"http://www.bootcdn.cn",target:"_blank",rel:"noopener noreferrer"},"www.bootcdn.cn"),s(" \u641C\u7D22 mock.js")]),n("div",{class:"language-html line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"<!-- \u5F15\u5165\u5916\u90E8\u94FE\u63A5 -->"),s(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),s(),n("span",{class:"token attr-name"},"src"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("https://cdn.bootcdn.net/ajax/libs/Mock.js/1.0.1-beta3/mock.js"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"}),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("script")]),n("span",{class:"token punctuation"},">")]),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br")])])],-1),Dt=n("p",null,"\u53C2\u65701\uFF1A\u63A5\u53E3\u540D",-1),Nt=n("p",null,"\u53C2\u65702\uFF1A\u8FD4\u56DE\u7684\u6570\u636E",-1),Lt=n("h4",{id:"\u5E38\u7528\u7684\u6570\u636E\u6A21\u62DF",tabindex:"-1"},[s("\u5E38\u7528\u7684\u6570\u636E\u6A21\u62DF "),n("a",{class:"header-anchor",href:"#\u5E38\u7528\u7684\u6570\u636E\u6A21\u62DF","aria-hidden":"true"},"#")],-1),Ot=n("blockquote",null,[n("p",null,[s("==\u66F4\u591A\u6A21\u677F\u65B9\u6CD5\uFF0C\u67E5\u770B\u5B98\u7F51\u793A\u4F8B==\uFF1A"),n("a",{href:"http://mockjs.com/examples.html",target:"_blank",rel:"noopener noreferrer"},"http://mockjs.com/examples.html")])],-1),Jt=n("h5",{id:"id",tabindex:"-1"},[s("id "),n("a",{class:"header-anchor",href:"#id","aria-hidden":"true"},"#")],-1),Et=n("p",null,"list|1-100\uFF1A\u8FD4\u56DE\u7684list\uFF0C\u53D61~100\u7684\u968F\u673A\u6570\u91CF\u3002",-1),Pt=n("p",null,"'id|+1'\uFF1A\u6BCF\u6B21\u81EA\u589E1",-1),Ct=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token keyword"},"var"),s(" data "),n("span",{class:"token operator"},"="),s(" Mock"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"mock"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'getbooks'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token string"},"'list|1-100'"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),s(`
          `),n("span",{class:"token punctuation"},"{"),s(`
              `),n("span",{class:"token string"},"'id|+1'"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},","),s(`
              `),n("span",{class:"token string"},"'boolName'"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'\u897F\u6E38\u8BB0'"),n("span",{class:"token punctuation"},","),s(`
          `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token punctuation"},"]"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  
  $`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"ajax"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),s(`
      url`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'getbooks'"),n("span",{class:"token punctuation"},","),s(`
      `),n("span",{class:"token function-variable function"},"success"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"res"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br")])],-1),Ht=n("h5",{id:"\u65F6\u95F4",tabindex:"-1"},[s("\u65F6\u95F4 "),n("a",{class:"header-anchor",href:"#\u65F6\u95F4","aria-hidden":"true"},"#")],-1),Mt=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token keyword"},"var"),s(" data "),n("span",{class:"token operator"},"="),s(" Mock"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"mock"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'getbooks'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token string"},"'list|1-100'"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),s(`
          `),n("span",{class:"token punctuation"},"{"),s(`
              `),n("span",{class:"token string"},"'id|+1'"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},","),s(`
              `),n("span",{class:"token string"},"'data'"),n("span",{class:"token operator"},":"),s(" @"),n("span",{class:"token function"},"date"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},'"yyyy-MM-dd"'),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),s(`
          `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token punctuation"},"]"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  
  $`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"ajax"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),s(`
      url`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'getbooks'"),n("span",{class:"token punctuation"},","),s(`
      `),n("span",{class:"token function-variable function"},"success"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"res"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  
  `),n("span",{class:"token comment"},"// \u7ED3\u679C"),s(`
  `),n("span",{class:"token punctuation"},"["),s(`
      `),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token string"},"'id'"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},","),s(`
  	`),n("span",{class:"token string"},"'data'"),n("span",{class:"token operator"},":"),s(" @"),n("span",{class:"token function"},"date"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},'"2000-4-28"'),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),s(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(`
      `),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token string"},"'id'"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"2"),n("span",{class:"token punctuation"},","),s(`
          `),n("span",{class:"token string"},"'data'"),n("span",{class:"token operator"},":"),s(" @"),n("span",{class:"token function"},"date"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},'"1988-3-15"'),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),s(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(`
      \xB7\xB7\xB7
  `),n("span",{class:"token punctuation"},"]"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br"),n("span",{class:"line-number"},"22"),n("br"),n("span",{class:"line-number"},"23"),n("br"),n("span",{class:"line-number"},"24"),n("br"),n("span",{class:"line-number"},"25"),n("br"),n("span",{class:"line-number"},"26"),n("br"),n("span",{class:"line-number"},"27"),n("br"),n("span",{class:"line-number"},"28"),n("br")])],-1),Rt=n("h3",{id:"fetch-\u63A5\u53E3",tabindex:"-1"},[s("Fetch \u63A5\u53E3 "),n("a",{class:"header-anchor",href:"#fetch-\u63A5\u53E3","aria-hidden":"true"},"#")],-1),At=n("blockquote",null,[n("p",null,[s("\u5B98\u7F51\u5730\u5740\uFF1A"),n("a",{href:"https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API/Using_Fetch",target:"_blank",rel:"noopener noreferrer"},"https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API/Using_Fetch")]),n("p",null,"Fetch \u63D0\u4F9B\u4E86\u4E00\u4E2A JavaScript \u63A5\u53E3\uFF0C\u7528\u4E8E\u8BBF\u95EE\u548C\u64CD\u4F5C HTTP \u7BA1\u9053\u7684\u4E00\u4E9B\u5177\u4F53\u90E8\u5206\u3002"),n("div",{class:"language-html line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"<!-- \u5F15\u5165\u5916\u90E8\u94FE\u63A5 -->"),s(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),s(),n("span",{class:"token attr-name"},"src"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("https://cdn.bootcdn.net/ajax/libs/fetch/3.6.2/fetch.min.js"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"}),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("script")]),n("span",{class:"token punctuation"},">")]),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br")])])],-1),$t=n("p",null,"\u7B2C\u4E00\u4E2A then(fn)\uFF1A\u8FD4\u56DE\u4E00\u4E2A json\uFF0C\u901A\u8FC7\u7B2C\u4E8C\u4E2A then \u63A5\u6536",-1),Xt=n("p",null,"\u7B2C\u4E8C\u4E2A then(fn)\uFF1A\u8FD4\u56DE\u7684\u662F\u63A5\u6536\u7684\u6570\u636E",-1),It=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token function"},"fetch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/getbooks'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"res"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token keyword"},"return"),s(" res"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"json"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"data"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br")])],-1),Ft=n("h4",{id:"\u6DFB\u52A0\u6570\u636E-1",tabindex:"-1"},[s("\u6DFB\u52A0\u6570\u636E "),n("a",{class:"header-anchor",href:"#\u6DFB\u52A0\u6570\u636E-1","aria-hidden":"true"},"#")],-1),Ut=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token function"},"fetch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/addbook'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"{"),s(`
      method`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'POST'"),n("span",{class:"token punctuation"},","),s(`
      body`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"stringify"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),s(" auther"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},'"\u5434\u627F\u6069"'),n("span",{class:"token punctuation"},","),s(" bookname"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},'"\u897F\u6E38\u8BB0"'),n("span",{class:"token punctuation"},","),s(" publisher"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},'"\u5317\u4EAC\u51FA\u7248\u793E"'),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      headers`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"Headers"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token string"},"'Content-Type'"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'application/json'"),s(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"res"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      `),n("span",{class:"token keyword"},"return"),s(" res"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"json"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"data"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br")])],-1),Gt=n("h3",{id:"axios-\u63A5\u53E3\uFF08\u63A8\u8350\uFF09",tabindex:"-1"},[s("axios \u63A5\u53E3\uFF08\u63A8\u8350\uFF09 "),n("a",{class:"header-anchor",href:"#axios-\u63A5\u53E3\uFF08\u63A8\u8350\uFF09","aria-hidden":"true"},"#")],-1),Bt=n("blockquote",null,[n("p",null,[s("\u5B98\u7F51\u5730\u5740\uFF1A"),n("a",{href:"http://www.axios-js.com/",target:"_blank",rel:"noopener noreferrer"},"http://www.axios-js.com/")]),n("div",{class:"language-html line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token comment"},"<!-- \u5F15\u5165\u5916\u90E8\u94FE\u63A5 -->"),s(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),s(),n("span",{class:"token attr-name"},"src"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"}),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("script")]),n("span",{class:"token punctuation"},">")]),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br")])])],-1),zt=n("h4",{id:"catch-\u6355\u83B7\u8BF7\u6C42\u9519\u8BEF",tabindex:"-1"},[s("catch \u6355\u83B7\u8BF7\u6C42\u9519\u8BEF "),n("a",{class:"header-anchor",href:"#catch-\u6355\u83B7\u8BF7\u6C42\u9519\u8BEF","aria-hidden":"true"},"#")],-1),Wt=n("p",null,[n("strong",null,"\u6700\u540E \u70B9\u51FA catch \u53EF\u4EE5\u6355\u83B7\u5F53\u524D\u8BF7\u6C42\u9519\u8BEF\u4FE1\u606F")],-1),Qt=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("axios"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"get"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/getbooks'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"res"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("res"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"catch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"error"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("error"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br")])],-1),Vt=n("h4",{id:"post-\u8BF7\u6C42-1",tabindex:"-1"},[s("post \u8BF7\u6C42 "),n("a",{class:"header-anchor",href:"#post-\u8BF7\u6C42-1","aria-hidden":"true"},"#")],-1),Kt=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[s("axios"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"post"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/addbook'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"{"),s(`
      bookname`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'\u897F\u6E38\u8BB0'"),n("span",{class:"token punctuation"},","),s(`
      author`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'\u5434\u627F\u6069'"),n("span",{class:"token punctuation"},","),s(`
      publisher`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'\u5317\u4EAC\u51FA\u7248\u793E'"),n("span",{class:"token punctuation"},","),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"res"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("res"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"catch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"error"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("error"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br")])],-1),Yt=n("h4",{id:"ajax-\u65B9\u5F0F",tabindex:"-1"},[s("Ajax \u65B9\u5F0F "),n("a",{class:"header-anchor",href:"#ajax-\u65B9\u5F0F","aria-hidden":"true"},"#")],-1),Zt=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token function"},"axios"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),s(`
      url`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/getbooks'"),n("span",{class:"token punctuation"},","),s(`
      method`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'get'"),n("span",{class:"token punctuation"},","),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"res"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("res"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br")])],-1),ne=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token function"},"axios"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),s(`
      url`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'http://www.liulongbin.top:3006/api/addbook'"),n("span",{class:"token punctuation"},","),s(`
      method`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'post'"),n("span",{class:"token punctuation"},","),s(`
      data`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(`
      	bookname`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'\u897F\u6E38\u8BB0'"),n("span",{class:"token punctuation"},","),s(`
          author`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'\u5434\u627F\u6069'"),n("span",{class:"token punctuation"},","),s(`
          publisher`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'\u5317\u4EAC\u51FA\u7248\u793E'"),n("span",{class:"token punctuation"},","),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"res"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),s("res"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br")])],-1),se=n("h2",{id:"art-template-\u6A21\u677F",tabindex:"-1"},[s("art-template \u6A21\u677F "),n("a",{class:"header-anchor",href:"#art-template-\u6A21\u677F","aria-hidden":"true"},"#")],-1),ae=n("blockquote",null,[n("p",null,[s("\u5B98\u7F51\u5730\u5740\uFF1A"),n("a",{href:"http://aui.github.io/art-template/docs/syntax.html",target:"_blank",rel:"noopener noreferrer"},"http://aui.github.io/art-template/docs/syntax.html")]),n("p",null,"\u827A\u672F\u6A21\u677F - \u9AD8\u6027\u80FD JavaScript \u6A21\u677F\u5F15\u64CE\u3002"),n("div",{class:"language-html line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),s(),n("span",{class:"token attr-name"},"src"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("https://cdn.bootcdn.net/ajax/libs/art-template/4.13.2/lib/template-web.js"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"}),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("script")]),n("span",{class:"token punctuation"},">")]),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br")])])],-1),te=n("p",null,[n("strong",null,"\u4F7F\u7528art\u6A21\u677F\u65F6\uFF0C\u9700\u8981\u4F7F\u7528id\u503C\u8FDB\u884C\u7ED1\u5B9A\u3002")],-1),ee=n("p",null,"\u53C2\u65701\uFF1Aid\u503C\u3002\u53C2\u65702\uFF1A\u5BF9\u8C61\u6570\u636E\u3002",-1),oe=n("div",{class:"language-javascript line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token function"},"template"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'id\u503C'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"{"),s("\u6570\u636E"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br")])],-1),ce=n("div",{class:"language-html line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("div")]),s(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("box"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),s(),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("div")]),n("span",{class:"token punctuation"},">")]),s(`
  
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),s(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("text/html"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"id"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("box"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(`
  	`),n("span",{class:"token operator"},"<"),s("h1"),n("span",{class:"token operator"},">"),s(`
      	`),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"{"),s("uName"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"}"),s(),n("span",{class:"token operator"},"-"),s(),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"{"),s("age"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token operator"},"<"),n("span",{class:"token operator"},"/"),s("h1"),n("span",{class:"token operator"},">"),s(`
  `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("script")]),n("span",{class:"token punctuation"},">")]),s(`
  
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(`
      `),n("span",{class:"token comment"},"// \u8BBE\u7F6E\u5F53\u524D id \u4E3A box \u7684\u6570\u636E"),s(`
  	`),n("span",{class:"token keyword"},"var"),s(" html "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token function"},"template"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'box'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"{"),s("uName"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'\u5F20\u4E09'"),n("span",{class:"token punctuation"},","),s(" age"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"17"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token comment"},"// \u6253\u5370\u5728\u5185\u5BB9\u533A"),s(`
      document`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'.box'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),s("innerHTML "),n("span",{class:"token operator"},"="),s(" html"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("script")]),n("span",{class:"token punctuation"},">")]),s(`
  
  `),n("span",{class:"token comment"},"<!--\u7ED3\u679C\uFF1A\u5F20\u4E09 - 17 -->"),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br")])],-1),le=n("h3",{id:"art-template-\u5FAA\u73AF\u8BED\u6CD5",tabindex:"-1"},[s("art-template \u5FAA\u73AF\u8BED\u6CD5 "),n("a",{class:"header-anchor",href:"#art-template-\u5FAA\u73AF\u8BED\u6CD5","aria-hidden":"true"},"#")],-1),pe=n("blockquote",null,[n("p",null,"each \u904D\u5386\u5BF9\u8C61\u6570\u7EC4")],-1),ue=n("div",{class:"language-html line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("div")]),s(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("box"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("div")]),n("span",{class:"token punctuation"},">")]),s(`
  
  `),n("span",{class:"token comment"},"<!-- \u904D\u5386 data \u5BF9\u8C61\u4E2D\u7684 list\uFF0Cindex\u662F\u4E0B\u6807\uFF0Cvalue\u662F\u6BCF\u4E00\u9879\u7684\u503C -->"),s(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),s(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("text/html"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"id"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("list"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(`
  	`),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"{"),s("each list"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"}"),s(`
  		`),n("span",{class:"token operator"},"<"),s("h2"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"{"),s("$index"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"}"),s(),n("span",{class:"token operator"},"-"),s(),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"{"),s("$value"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token operator"},"<"),n("span",{class:"token operator"},"/"),s("h2"),n("span",{class:"token operator"},">"),s(`
  	`),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"{"),n("span",{class:"token operator"},"/"),s("each"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"}"),s(`
  `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("script")]),n("span",{class:"token punctuation"},">")]),s(`
  
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(`
      `),n("span",{class:"token comment"},"// \u51C6\u5907\u7684\u6570\u636E"),s(`
      `),n("span",{class:"token keyword"},"var"),s(" data "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token punctuation"},"{"),s(`
          list`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'\u5F20\u4E09'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'\u674E\u56DB'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token comment"},"// \u904D\u5386 data \u5BF9\u8C61"),s(`
      `),n("span",{class:"token keyword"},"var"),s(" html "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token function"},"template"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'list'"),n("span",{class:"token punctuation"},","),s(" data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      document`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'.box'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),s("innerHTML "),n("span",{class:"token operator"},"="),s(" html"),n("span",{class:"token punctuation"},";"),s(`
  `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("script")]),n("span",{class:"token punctuation"},">")]),s(`
  
  `),n("span",{class:"token comment"},`<!--\u7ED3\u679C\uFF1A
  	0 - \u5F20\u4E09
  	1 - \u674E\u56DB
  -->`),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br"),n("span",{class:"line-number"},"22"),n("br"),n("span",{class:"line-number"},"23"),n("br")])],-1),ie=n("h3",{id:"\u6CE8\u610F\u4E8B\u9879",tabindex:"-1"},[s("\u6CE8\u610F\u4E8B\u9879 "),n("a",{class:"header-anchor",href:"#\u6CE8\u610F\u4E8B\u9879","aria-hidden":"true"},"#")],-1),re=n("div",{class:"language-txt line-numbers-mode"},[n("pre",null,[n("code",null,`1. \u56FA\u5B9A\u8BED\u6CD5: type\uFF0C\u8BBE\u7F6Eid\u503C
  <script type="text/html" id="list"><\/script>
  
  2. \u8BED\u6CD5
  template('id\u503C', \u6570\u636E);
  
  3. \u904D\u5386\u8BED\u6CD5
    \u662F\u6570\u7EC4\u7684\u8BDD\uFF0Cindex\u662F\u6570\u7EC4\u4E2D\u7684\u4E0B\u6807\uFF0Cvalue\u662F\u6570\u7EC4\u4E2D\u7684\u6BCF\u4E00\u9879
    \u662F\u5BF9\u8C61\u7684\u8BDD\uFF0Cindex\u5BF9\u8C61\u7684\u6BCF\u4E00\u9879\uFF0Cvalue\u53EF\u4EE5\u70B9\u51FA\u5C5E\u6027
  {{each}}
  	{{$iindex}} {{$value}}
  {{/each}}
  `)]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br")])],-1),ke=n("h3",{id:"art-\u6E32\u67D3\u5217\u8868",tabindex:"-1"},[s("art \u6E32\u67D3\u5217\u8868 "),n("a",{class:"header-anchor",href:"#art-\u6E32\u67D3\u5217\u8868","aria-hidden":"true"},"#")],-1),be=n("blockquote",null,[n("p",null,"\u6E32\u67D3\u5217\u8868\uFF08\u63A5\u53E3\u6709\u95EE\u9898\uFF09")],-1),me=n("div",{class:"language-html line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("tbody")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("tbody")]),n("span",{class:"token punctuation"},">")]),s(`
  
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),s(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("text/html"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"id"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("item"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(`
  	`),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"{"),s("each"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"}"),s(`
  		`),n("span",{class:"token operator"},"<"),s("tr"),n("span",{class:"token operator"},">"),s(`
  			`),n("span",{class:"token operator"},"<"),s("td"),n("span",{class:"token operator"},">"),s("\u6B22\u8FCE\u5927\u5BB6"),n("span",{class:"token operator"},"<"),n("span",{class:"token operator"},"/"),s("td"),n("span",{class:"token operator"},">"),s(`
  			`),n("span",{class:"token operator"},"<"),s("td"),n("span",{class:"token operator"},">"),s(`
  				`),n("span",{class:"token operator"},"<"),s("button"),n("span",{class:"token operator"},">"),s("\u8BC4\u8BBA\u4EBA\uFF1A"),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"{"),s("$value"),n("span",{class:"token punctuation"},"."),s("username"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token operator"},"<"),n("span",{class:"token operator"},"/"),s("button"),n("span",{class:"token operator"},">"),s(`
    				`),n("span",{class:"token operator"},"<"),s("button"),n("span",{class:"token operator"},">"),s("\u8BC4\u8BBA\u65F6\u95F4\uFF1A"),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"{"),s("$"),n("span",{class:"token punctuation"},"."),s("value"),n("span",{class:"token punctuation"},"."),s("time"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token operator"},"<"),n("span",{class:"token operator"},"/"),s("button"),n("span",{class:"token operator"},">"),s(`
      		`),n("span",{class:"token operator"},"<"),n("span",{class:"token operator"},"/"),s("td"),n("span",{class:"token operator"},">"),s(`
      	`),n("span",{class:"token operator"},"<"),n("span",{class:"token operator"},"/"),s("tr"),n("span",{class:"token operator"},">"),s(`
  	`),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"{"),n("span",{class:"token operator"},"/"),s("each"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"}"),s(`
  `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("script")]),n("span",{class:"token punctuation"},">")]),s(`
  
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(`
      $`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"ajax"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),s(`
          type`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'post'"),n("span",{class:"token punctuation"},","),s(`
          url`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'http://www/liulongbin.top:3006/api/addcmt'"),n("span",{class:"token punctuation"},","),s(`
          data`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(`
              username`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'uName'"),n("span",{class:"token punctuation"},","),s(`
              content`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'content'"),n("span",{class:"token punctuation"},","),s(`
          `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(`
          `),n("span",{class:"token function-variable function"},"succrss"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"res"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
              `),n("span",{class:"token function"},"renderList"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
      `),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token function"},"renderList"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          $`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"ajax"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),s(`
              type`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'get'"),n("span",{class:"token punctuation"},","),s(`
              url`),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'http://www/liulongbin.top:3006/api/cmtlist'"),n("span",{class:"token punctuation"},","),s(`
              `),n("span",{class:"token function-variable function"},"success"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"res"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
                  `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("res"),n("span",{class:"token punctuation"},"."),s("status "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"200"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
                      `),n("span",{class:"token keyword"},"var"),s(" html "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token function"},"template"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'item'"),n("span",{class:"token punctuation"},","),s(" res"),n("span",{class:"token punctuation"},"."),s("data"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
                      document`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'tbody'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),s("innerHTML "),n("span",{class:"token operator"},"="),s(" html"),n("span",{class:"token punctuation"},";"),s(`
                  `),n("span",{class:"token punctuation"},"}"),s(`
              `),n("span",{class:"token punctuation"},"}"),s(`
          `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
      `),n("span",{class:"token punctuation"},"}"),s(`
  `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("script")]),n("span",{class:"token punctuation"},">")]),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br"),n("span",{class:"line-number"},"22"),n("br"),n("span",{class:"line-number"},"23"),n("br"),n("span",{class:"line-number"},"24"),n("br"),n("span",{class:"line-number"},"25"),n("br"),n("span",{class:"line-number"},"26"),n("br"),n("span",{class:"line-number"},"27"),n("br"),n("span",{class:"line-number"},"28"),n("br"),n("span",{class:"line-number"},"29"),n("br"),n("span",{class:"line-number"},"30"),n("br"),n("span",{class:"line-number"},"31"),n("br"),n("span",{class:"line-number"},"32"),n("br"),n("span",{class:"line-number"},"33"),n("br"),n("span",{class:"line-number"},"34"),n("br"),n("span",{class:"line-number"},"35"),n("br"),n("span",{class:"line-number"},"36"),n("br"),n("span",{class:"line-number"},"37"),n("br"),n("span",{class:"line-number"},"38"),n("br"),n("span",{class:"line-number"},"39"),n("br"),n("span",{class:"line-number"},"40"),n("br")])],-1),de=n("h2",{id:"\u6848\u4F8B\uFF1A\u4E8C\u8FDB\u5236\u6587\u4EF6\u4E0A\u4F20",tabindex:"-1"},[s("\u6848\u4F8B\uFF1A\u4E8C\u8FDB\u5236\u6587\u4EF6\u4E0A\u4F20 "),n("a",{class:"header-anchor",href:"#\u6848\u4F8B\uFF1A\u4E8C\u8FDB\u5236\u6587\u4EF6\u4E0A\u4F20","aria-hidden":"true"},"#")],-1),he=n("blockquote",null,[n("p",null,"\u9700\u6C42\uFF1A\u4E0A\u4F20\u6587\u4EF6\u8FDB\u5EA6\u6761\u3002"),n("p",null,[s("bootstrap\u5B98\u7F51\uFF1A"),n("a",{href:"https://v3.bootcss.com",target:"_blank",rel:"noopener noreferrer"},"https://v3.bootcss.com")]),n("div",{class:"language-html line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("link")]),s(),n("span",{class:"token attr-name"},"href"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.0-beta3/css/bootstrap.min.css"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"rel"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("stylesheet"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br")])])],-1),ge=n("div",{class:"language-html line-numbers-mode"},[n("pre",null,[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("input")]),s(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("file"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"id"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("file"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),s(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("div")]),s(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("progress"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),s(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("div")]),s(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("progress-bar"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"role"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("progressbar"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"aria-valuenow"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("60"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"aria-valuemin"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("0"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"aria-valuemax"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("100"),n("span",{class:"token punctuation"},'"')]),s(`
           `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),s(" 60%"),n("span",{class:"token punctuation"},";")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),s(`
          60%
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("div")]),n("span",{class:"token punctuation"},">")]),s(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("div")]),n("span",{class:"token punctuation"},">")]),s(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("div")]),s(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("box"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("div")]),n("span",{class:"token punctuation"},">")]),s(`
  
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(`
      `),n("span",{class:"token comment"},"// 1. \u83B7\u53D6\u9875\u9762\u5143\u7D20"),s(`
      `),n("span",{class:"token keyword"},"var"),s(" file "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"getElementById"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'file'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token keyword"},"var"),s(" bar "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'.progress-bar'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token keyword"},"var"),s(" box "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"querySelector"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'.box'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
      `),n("span",{class:"token comment"},"// 2.\u6DFB\u52A0change\u4E8B\u4EF6"),s(`
      file`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"addEventListener"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'change'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
          `),n("span",{class:"token comment"},"// \u539F\u751Fjs\u53D1\u9001ajax\u8BF7\u6C42"),s(`
          `),n("span",{class:"token keyword"},"var"),s(" formData "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"FormData"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          formData`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"append"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'attrName'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"this"),n("span",{class:"token punctuation"},"."),s("files"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
          `),n("span",{class:"token keyword"},"var"),s(" xhr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"new"),s(),n("span",{class:"token class-name"},"XMLHttpRequest"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          xhr`),n("span",{class:"token punctuation"},"."),s("upload"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onprogress"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"ev"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
              `),n("span",{class:"token comment"},"// \u8FDB\u5EA6\u6761 = \u5DF2\u4E0A\u4F20 / \u603B\u91CF * 100%"),s(`
              `),n("span",{class:"token keyword"},"var"),s(" r "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token punctuation"},"("),s("ev"),n("span",{class:"token punctuation"},"."),s("loaded "),n("span",{class:"token operator"},"/"),s(" ev"),n("span",{class:"token punctuation"},"."),s("total"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"*"),s(),n("span",{class:"token number"},"100"),s(),n("span",{class:"token operator"},"+"),s(),n("span",{class:"token string"},"'%'"),n("span",{class:"token punctuation"},";"),s(`
              `),n("span",{class:"token comment"},"// \u8FDB\u5EA6\u6761\u767E\u5206\u6BD4"),s(`
              bar`),n("span",{class:"token punctuation"},"."),s("style"),n("span",{class:"token punctuation"},"."),s("width "),n("span",{class:"token operator"},"="),s(" r"),n("span",{class:"token punctuation"},";"),s(`
              bar`),n("span",{class:"token punctuation"},"."),s("innerHTML "),n("span",{class:"token operator"},"="),s(" r"),n("span",{class:"token punctuation"},";"),s(`
          `),n("span",{class:"token punctuation"},"}"),s(`
  
          xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"open"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'post'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'localhost:3000/upload'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
          xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"send"),n("span",{class:"token punctuation"},"("),s("formData"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
  
          xhr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onload"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
              
              `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("status "),n("span",{class:"token operator"},"=="),s(),n("span",{class:"token number"},"200"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
                  `),n("span",{class:"token keyword"},"var"),s(" path "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token constant"},"JSON"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"parse"),n("span",{class:"token punctuation"},"("),s("xhr"),n("span",{class:"token punctuation"},"."),s("responseText"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),s("path"),n("span",{class:"token punctuation"},";"),s(`
                  `),n("span",{class:"token keyword"},"var"),s(" img "),n("span",{class:"token operator"},"="),s(" document"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"createElement"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'img'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
                  img`),n("span",{class:"token punctuation"},"."),s("src "),n("span",{class:"token operator"},"="),s(" path"),n("span",{class:"token punctuation"},";"),s(`
                  img`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function-variable function"},"onload"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token keyword"},"function"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(`
                      box`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"appendChild"),n("span",{class:"token punctuation"},"("),s("img"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
                  `),n("span",{class:"token punctuation"},"}"),s(`
              `),n("span",{class:"token punctuation"},"}"),s(`
              
          `),n("span",{class:"token punctuation"},"}"),s(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(`
  `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("script")]),n("span",{class:"token punctuation"},">")]),s(`
  `)])]),n("div",{class:"line-numbers-wrapper"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br"),n("span",{class:"line-number"},"22"),n("br"),n("span",{class:"line-number"},"23"),n("br"),n("span",{class:"line-number"},"24"),n("br"),n("span",{class:"line-number"},"25"),n("br"),n("span",{class:"line-number"},"26"),n("br"),n("span",{class:"line-number"},"27"),n("br"),n("span",{class:"line-number"},"28"),n("br"),n("span",{class:"line-number"},"29"),n("br"),n("span",{class:"line-number"},"30"),n("br"),n("span",{class:"line-number"},"31"),n("br"),n("span",{class:"line-number"},"32"),n("br"),n("span",{class:"line-number"},"33"),n("br"),n("span",{class:"line-number"},"34"),n("br"),n("span",{class:"line-number"},"35"),n("br"),n("span",{class:"line-number"},"36"),n("br"),n("span",{class:"line-number"},"37"),n("br"),n("span",{class:"line-number"},"38"),n("br"),n("span",{class:"line-number"},"39"),n("br"),n("span",{class:"line-number"},"40"),n("br"),n("span",{class:"line-number"},"41"),n("br"),n("span",{class:"line-number"},"42"),n("br"),n("span",{class:"line-number"},"43"),n("br"),n("span",{class:"line-number"},"44"),n("br"),n("span",{class:"line-number"},"45"),n("br"),n("span",{class:"line-number"},"46"),n("br")])],-1),fe=[N,L,O,J,E,P,C,H,M,R,A,$,X,I,F,U,G,B,z,W,Q,V,K,Y,Z,nn,sn,an,tn,en,on,cn,ln,pn,un,rn,kn,bn,mn,dn,hn,gn,fn,_n,vn,wn,xn,yn,jn,qn,Sn,Tn,Dn,Nn,Ln,On,Jn,En,Pn,Cn,Hn,Mn,Rn,An,$n,Xn,In,Fn,Un,Gn,Bn,zn,Wn,Qn,Vn,Kn,Yn,Zn,ns,ss,as,ts,es,os,cs,ls,ps,us,is,rs,ks,bs,ms,ds,hs,gs,fs,_s,vs,ws,xs,ys,js,qs,Ss,Ts,Ds,Ns,Ls,Os,Js,Es,Ps,Cs,Hs,Ms,Rs,As,$s,Xs,Is,Fs,Us,Gs,Bs,zs,Ws,Qs,Vs,Ks,Ys,Zs,na,sa,aa,ta,ea,oa,ca,la,pa,ua,ia,ra,ka,ba,ma,da,ha,ga,fa,_a,va,wa,xa,ya,ja,qa,Sa,Ta,Da,Na,La,Oa,Ja,Ea,Pa,Ca,Ha,Ma,Ra,Aa,$a,Xa,Ia,Fa,Ua,Ga,Ba,za,Wa,Qa,Va,Ka,Ya,Za,nt,st,at,tt,et,ot,ct,lt,pt,ut,it,rt,kt,bt,mt,dt,ht,gt,ft,_t,vt,wt,xt,yt,jt,qt,St,Tt,Dt,Nt,Lt,Ot,Jt,Et,Pt,Ct,Ht,Mt,Rt,At,$t,Xt,It,Ft,Ut,Gt,Bt,zt,Wt,Qt,Vt,Kt,Yt,Zt,ne,se,ae,te,ee,oe,ce,le,pe,ue,ie,re,ke,be,me,de,he,ge];function _e(ve,we,xe,ye,je,qe){return e(),t("div",null,fe)}var De=a(D,[["render",_e]]);export{Te as __pageData,De as default};
  