先在templates文件夹下建立HTML文件。前端的HTML，css。根据自己需求来设计。我这里要做的是股票的搜索功能。
股票的数据库：数据库下载
HTML：
</div><input type="text" id="content" name="搜索内容"><button type="button" id="commit_btn" value="搜索" >搜索</button><p>支持多条件匹配，例如：北京&房地产&银行（关键词之间用&连接）。</p><div id="table"><table id="tset" style="font-size:14px; " border="2px"><thead><tr><th>股票代码</th><th>股票简称</th><th>所属行业</th><th>城市</th><th>主营业务名称</th><th>所属概念</th></tr></thead><tbody></tbody></table></div></div>
jQuery + Ajax 进行前后端交互。
$("#commit_btn").click(function () { //点击id为commit_btn的事件触发$("#tset tbody").html("");$.ajax({url: 'handle',//调用后端views.py里的handle函数type: 'post',data: {content: $('#content').val()},//将id为content的搜索内容提交后端//headers:{"X-CSRFToken":$.cookie("csrftoken")}, 取消csrf认证success: function (data) { //将后端返回数据添加到HTML的表格中console.log(data);for (var i = 0; i < data.length; i++) {if (i > 0) {if (data[i][0] !== data[i - 1][0]) { //这里要和view里的逻辑相对应，例如股票名称中有北京，城市在北京，搜索北京就会相同数据出现两次，这里进行去重。str = "<tr><td>" + data[i][0] + "</td><td>" + data[i][1] + "</td><td>" + data[i][2] + "</td><td>" + data[i][3] + "</td><td>" + data[i][4] + "</td><td>" + data[i][5] + "</td></tr>";$("#tset").append(str);}} else {str = "<tr><td>" + data[i][0] + "</td><td>" + data[i][1] + "</td><td>" + data[i][2] + "</td><td>" + data[i][3] + "</td><td>" + data[i][4] + "</td><td>" + data[i][5] + "</td></tr>";$("#tset").append(str);}}},error: function (data) {alert(data.status)}})
});
后端views,py（以前写c的习惯，习惯提前定义）
def handle(request):text = request.POST.get("content")a = 0txtlist = []id_list = []service.addText(text)objects = models.Manager()db = Text.objects.all()if '&' in text: #多条件匹配，将搜索内容放入txtlist列表内for i in range(0, len(text)):if text[i] == "&":txtlist.append(text[a:i])a = i + 1txtlist.append(text[a:])print(txtlist)for a in range(0, len(txtlist)): #将每个条件依次筛选for i in db:if txtlist[a] in i.id:body_list = [i.id, i.name, i.trade, i.city, i.main, i.concept]id_list.append(body_list)if txtlist[a] in i.name:body_list = [i.id, i.name, i.trade, i.city, i.main, i.concept]id_list.append(body_list)if txtlist[a] in i.trade:body_list = [i.id, i.name, i.trade, i.city, i.main, i.concept]id_list.append(body_list)if txtlist[a] in i.city:body_list = [i.id, i.name, i.trade, i.city, i.main, i.concept]id_list.append(body_list)if txtlist[a] in i.main:body_list = [i.id, i.name, i.trade, i.city, i.main, i.concept]id_list.append(body_list)if txtlist[a] in i.concept:body_list = [i.id, i.name, i.trade, i.city, i.main, i.concept]id_list.append(body_list)if a == 0: #id_lists为临时变量，存储每次匹配相与（&）的数据。id_lists = id_listid_list = []else:id_lists = [x for x in id_list if x in id_lists] id_list = []id_list = id_listselse:for i in db:if text in i.id:body_list = [i.id, i.name, i.trade, i.city, i.main, i.concept]id_list.append(body_list)if text in i.name:body_list = [i.id, i.name, i.trade, i.city, i.main, i.concept]id_list.append(body_list)if text in i.trade:body_list = [i.id, i.name, i.trade, i.city, i.main, i.concept]id_list.append(body_list)if text in i.city:body_list = [i.id, i.name, i.trade, i.city, i.main, i.concept]id_list.append(body_list)if text in i.main:body_list = [i.id, i.name, i.trade, i.city, i.main, i.concept]id_list.append(body_list)if text in i.concept:body_list = [i.id, i.name, i.trade, i.city, i.main, i.concept]id_list.append(body_list)print(id_list)return JsonResponse(list(id_list), safe=False, json_dumps_params={'ensure_ascii': False})
至此，在网页中就可搜索股票信息。