1. <!DOCTYPE html>
    2. <html lang="zh">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <title>TestAjax</title>
    6.     <style>
    7.         #result{
    8.             width: 200px;
    9.             height: 100px;
    10.             border: solid 1px #2a5caa;
    11.         }
    12.     </style>
    13. </head>
    14. <body>
    15.     <button>发送请求</button>
    16.     <button>取消请求</button>
    17.     <script>
    18.         const btns = document.querySelectorAll('button');
    19.         let x = null;
    20.         btns[0].onclick = function (){
    21.             x = new XMLHttpRequest();
    22.             x.open("GET",'http://localhost:8000/cancel')
    23.             x.send();
    24.             console.log("发送请求");
    25.         }
    26.         // 请求取消
    27.         btns[1].onclick = function (){
    28.            x.abort();
    29.         }
    31.     </script>
    32. </body>
    33. </html>