first commit

历届学生/front-end-team-10/项目练习/学生项目/冯凯/练习/3.4ajax封装/ajaxv1.js

@@ -0,0 +1,42 @@
+class Http {
+
+    constructor() {
+        this.xhr = new XMLHttpRequest();
+    }
+
+    
+    get(params) {
+        var par = ""
+        for (const key in params.data) {
+            par += `&${key}=${params.data[key]}`
+        }
+        par = par.replace("&", "?")
+        this.xhr.open("GET", `${params.url}${par}`)
+        this.xhr.send()
+
+        this.ReadyState(params)
+    }
+
+    post(params) {
+        this.xhr.open("POST", `${params.url}`)
+        this.xhr.setRequestHeader('Content-Type', 'application/json');
+        this.xhr.send(JSON.stringify(params.data))
+        this.ReadyState(params)
+    }
+
+
+    ReadyState(params) {
+        this.xhr.onreadystatechange = () => {
+            if (this.xhr.readyState == 4) {
+                if (this.xhr.status == 200) {
+                    var data = JSON.parse(this.xhr.response);
+                    params.success(data)
+                } else {
+                    params.error(this.xhr)
+                }
+            }
+        }
+    }
+}
+
+var http = new Http();

历届学生/front-end-team-10/项目练习/学生项目/冯凯/练习/3.4ajax封装/ajax封装.html

@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>封装</title>
+    <script src="ajaxv1.js"></script>
+</head>
+
+<body>
+
+</body>
+<script>
+    http.get({
+        url: 'http://127.0.0.1:3000/api/json/mechanismList',
+        data: {
+            id: 82,
+            page: 1
+        }
+    })
+        .then((res) => {
+            console.log(res);
+        })
+        .catch((err) => {
+            console.log(err);
+        });
+
+</script>
+
+</html>