ajaxリクエストの手順

1.クライアント

 <script>
 	 //拿到div容器
      const re = document.getElementById("result");
      //绑定div容器事件
      re.addEventListener("mouseover", function () {
    
    
       
        //1 绑定事件
        const xhr = new XMLHttpRequest();
        //2 初始化
        xhr.open("POST", "http://127.0.0.1:8000/server");
        //3发送
        xhr.send();
        //4 事件绑定
        xhr.onreadystatechange = function () {
    
    
          //判断
          if (xhr.readyState == 4) {
    
    
              if (xhr.status >= 200 && xhr.status < 300) {
    
    
                console.log(xhr.status);
                //处理服务端返回结果
                re.innerHTML = xhr.response;  
                 console.log(xhr.response);
            }
          }
        };
      });
    </script>

サービス-ターミナル

const express = require('express');

const app = express();

app.get('/server', (request, reponse)=>{
    
    
    reponse.setHeader("Access-Control-Allow-Origin","*");
    reponse.send("HELLO");
});

app.post('/server', (request, reponse)=>{
    
    
    reponse.setHeader("Access-Control-Allow-Origin","*");
    reponse.send("HELLO POST");
});

app.listen(8000, ()=>{
    
    
    console.log("8000监听中.....");
});

結果
マウスをボックスに移動すると、サーバーから返されたデータがボックスに表示されます。
ここに画像の説明を挿入
ここに画像の説明を挿入

おすすめ

転載: blog.csdn.net/qq_45432665/article/details/109221048