---
tags: AJAX,第一章
---
# AJAX第一章
















## get



```javascript=
<!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>Document</title>
<script src="jQuery.min.js"></script>
</head>
<body>
<button id="btnGET">發起請求</button>
<button id="btnGETinfo">請求info</button>
<script>
$('#btnGET').on('click', function () {
$.get('https://www.google.com/', function (res) {
console.log(res);
});
});
$('#btnGETinfo').on('click', function () {
$.get('https://www.facebook.com/', { id: 1 }, function (res) {
console.log(res);
});
});
</script>
</body>
</html>
```
## post

```javascript=
<!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>Document</title>
<script src="jQuery.min.js"></script>
</head>
<body>
<button id="btnPOST">發起請求</button>
<script>
$('#btnPOST').on('click', function () {
$.post('https://www.facebook.com/', { name: 123 }, function (res) {
console.log(res);
});
});
</script>
</body>
</html>
```
## ajax

```javascript=
<!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>Document</title>
<script src="jQuery.min.js"></script>
</head>
<body>
<button id="btnGET">發起請求</button>
<button id="btnPOST">提交數據</button>
<script>
$('#btnGET').on('click', function () {
$.ajax({
type: 'get',
url: 'https://www.facebook.com/',
data: { id: 1 },
success: function (res) {
console.log(res);
}
});
});
$('#btnPOST').on('click', function () {
$.ajax({
type: 'post',
url: 'https://www.facebook.com/',
data: { id: 1 },
success: function (res) {
console.log(res);
}
});
});
</script>
</body>
</html>
```







