浏览器向网站发送请求时:URL和表单的形式提交
- GET
- POST
特点:页面刷新
除此之外,也可以基于Ajax向后台发送请求(偷偷的发送请求)。
- 依赖jQuery
- 编写ajax代码
$.ajax({
url:"发送的地址",
type:"post",
data:{
n1:123,
n2:456
},
success:function(res){
console.log(res);
}
})
一.GET请求
$.ajax({
url:"/task/ajax",
type:"get",
data:{
n1:123,
n2:456
},
success:function(res){
console.log(res);
}
})
from django.shortcuts import render, HttpResponse
def task_ajax(request):
print(request.GET)
return HttpResponse("成功了")
二.POST请求
$.ajax({
url:"/task/ajax",
type:"post",
data:{
n1:123,
n2:456
},
success:function(res){
console.log(res);
}
})
from django,views.decorators.csrf import csrf exempt
@csrf_exempt
def task_ajax(request):
print(request.GET)
print(request.POST)
return HttpResponse("成功了")
三、vue初体验
基于vue.js框架来编写项目需要以下几个步骤:
-
导入vue.js包(CDN)
<!-- 开发环境版本,包含了有帮助的命令行警告 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
<!-- 生产环境版本,优化了尺寸和速度 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
# 当然,也可以将文件下载下来再通过本地导入。
- 应用
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!-- 1.引入vue.js文件 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
</head>
<body>
<!-- 2.指定区域,该区域的内容希望由vue.js来接管。 -->
<div id="app">
<h1>欢迎学习Vue.js</h1>
<div>我叫{{name}},微信{{wechat}}</div>
<input type="button" value="点我" v-on:click="clickMe">
</div>
<script>
// 3.创建Vue对象,并关联指定HTML区域。
var app = new Vue({
el: '#app',
data: {
name: '武沛齐',
wechat: 'wupeiqi888'
},
methods: {
clickMe: function () {
// 获取值this.name
// 修改值this.name = "xx"
this.name = "alex";
this.wechat = "wupeiqi666";
}
}
})
</script>
</body>
</html>