① 求助django 實現前端頁面檢索功能的代碼
設我們的 django 博客應用有如下的文章模型：
blog/models.pyclass Post(models.Model):
# 標題
title = models.CharField(max_length=70)
# 正文
body = models.TextField()
# 其他屬性
def __str__(self):
return self.title
先看到第 1 步，用戶在搜索框輸入搜索關鍵詞，因此我們要在博客上為用戶提供一個搜索表單，html 表單代碼大概像這樣：
<form method="get" action="/search/">
{% csrf_token %} <input type="search" placeholder="搜索" required>
<button type="submit">搜索</button></form>
特別注意在 form 標簽下有一個 {% csrf_token %}，這是 django 用來防禦跨站請求偽造（CSRF）攻擊的機制。如果不知道什麼是 CSRF 的話也沒有關系，只要記住在使用 django 時，前端的表單代碼里一定要加上 {% csrf_token %}。
用戶輸入了搜索關鍵詞並點擊了搜索按鈕後，數據就被發送給了 django 後台伺服器。表單的 action 屬性的值為 /search/，表明用戶提交的結果將被發送給 /search/ 這個 URL。我們為這個 URL 綁定一個 django 視圖函數，在這個視圖函數里完成前面第 2 步提到的過程。假設我們把視圖函數的代碼寫在 blog/views.py 里：
blog/views.pydef search(request):
q = request.GET.get('q')
error_msg = ''
if not q:
error_msg = '請輸入關鍵詞'
return render(request, 'blog/errors.html', {'error_msg': error_msg})
post_list = Post.objects.filter(title__icontains=q)
return render(request, 'blog/results.html', {'error_msg': error_msg,
'post_list': post_list})
首先我們使用 request.GET.get('q') 獲取到用戶提交的搜索關鍵詞。用戶通過表單提交的數據 django 為我們保存在 request.GET 里，這是一個類似於 Python 字典的對象，所以我們使用 get 方法從字典里取出鍵 q 對應的值，即用戶的搜索關鍵詞。這里字典的鍵之所以叫 q 是因為我們的表單中搜索框 input 的 name 屬性的值是 q，如果修改了 name 屬性的值，那麼這個鍵的名稱也要相應修改。
接下來我們做了一個小小的校驗，如果用戶沒有輸入搜索關鍵詞而提交了表單，我們就無需執行查詢，而是渲染一個錯誤頁面提示用戶請輸入關鍵詞。
如果用戶輸入了搜索關鍵詞，我們就通過 filter 方法從資料庫里過濾出符合條件的所有文章。這里的過濾條件是 title__icontains=q，即 title 中包含（contains）關鍵字 q，前綴 i 表示不區分大小寫。這里 icontains 是查詢表達式（Field lookups），其用法是在模型需要篩選的屬性後面跟上兩個下劃線。django 內置了很多查詢表達式，建議過一遍 django 官方留個印象，了解每個表達式的作用，以後碰到相關的需求就可以快速定位到文檔查詢其用途：Field lookups
接下來就是渲染搜索結果頁面，顯示符合搜索條件的文章列表，下面是一個模板的簡單示例：
results.html
{% if error_msg %} <p>{{ error_msg }}</p>{% endif %}
{% for post in post_list %} <div>
在這里顯示文章的相應信息 </div>{% empty %} <div class="no-post">
沒有搜索到符合條件的文章 </div>{% endfor %}
有了視圖函數後記得把視圖函數映射到相應了 URL，前面我們表單數據提交的 URL 為 /search/，因此將視圖函數 search 綁定到該 URL 上。
blog/urls.pyurlpatterns = [
# 其他 url 配置
url(r'^search/$', views.search, name='search'),]
大功告成！
② web前端怎麼設計有利於搜索引擎
搜索功能指的是搜索演算法的實現嗎？
如果是搜索演算法，涉及到基本的順序搜索，二分法等。
如果不是指演算法，而是網頁的搜索框：
html：一個textbox,一個button，
在button onclick事件中，執行js搜索演算法
③ javascript搜索功能是怎麼實現的要跟後台交互吧是不是和過濾功能差不多原理
搜索功能有多種實現方式 ，前後端都可以實現
第一種：
頁面內搜索（類似CTRL+F），這個可以純前端完成，直接用js匹配搜索結果，進行隱藏顯示或改變顏色等
第二種：
純後端方案，將搜索的字元串拼接到一個新的url參數後，然後跳轉到生成的url上，直接顯示新頁面搜索結果，如最早的搜索就是一個跳轉 ，目前已經不使用這種方式
第三種：
Ajax搜索，需要前後端配合，將關鍵字發送一個請求到後端，後端需要將結果的數據傳給前端，前端根據返回的數據，重新對頁面部分進行渲染
CTRL+F不支持正則，這個是瀏覽器自帶的功能，由於正則對於普通用戶來說，是很專業的，瀏覽器一般不會去支持很少有人會用的功能，當然是否支持取決於瀏覽器廠商的想法
④ web前端結構怎麼設計有利於搜索引擎
1，扁平化結構
2，麵包屑導航
3，最新最熱板塊
4，頁面靜態化
⑤ 在不適用搜索引擎的情況下如何實現前端的搜索功能
通過頁面開發與資料庫查找即可實現前端的搜索功能。
⑥ web前端組件怎麼實現
模塊化更一種開發規范，比如cmd amd 是為了更好的解藕，比如一個網站，按照不同的模塊來開發，比如你有個評論區，a 項目有，b 項目有，如果僅是單純的模塊開發，這個js 文件你就可以單獨來回引用，
更比如 ，一個頁面 分好多個功能， 這時候你要是都寫在一個js 中 會越來越大，
而你把他分成不同的模塊，
比如評論是一塊
分頁又是一塊，
已經上線，或你不做了，後期別人拉手，或你接手別人的項目， 這時候來個需求讓你把分頁去掉，或修改 你可以清楚的找到對應模塊文件 進行修改 或去掉
模塊是自定義的，
組件，更想當於一個通用的東西，有的分功能組件，有的分業務組件
大圖切換，這種就是單純的一個效果展示，只要調用就ok
一個分頁，也是只單純的調用，
組件更是一個多處都可以使用 ，不需要再單獨開發的
⑦ 前端怎麼進行組件化的開發，以及如何解決組件之間依賴
可以用webpack，目前最火的前端構建工具。只要載入loader，你想引用什麼模塊就引用什麼模塊。現在用的就是webpack+react，組件化太方便了。更多問題可以去php中文網問答社區提問
⑧ 用python實現網頁搜索功能
不知道你知道不知道AJAX，如果知道這個就容易弄了，用jq來POST數據，然後前面只用一個靜太頁就可以，點搜索就用ajax把搜索請求發過去，點修改就發修改請求
如果在一個頁面要實現也可以在下面加一個隱藏的input用來定義是哪個功能，然後後台再根據這個功能名去判斷如何處理
⑨ 在dreamweaver里怎麼實現網頁的搜索功能
有三種常見的方式
1、自己設計表單、編程、與資料庫鏈接檢索。
2、在網路或谷歌注冊申請站內搜索功能。獲得代碼，添加到自己的頁面中。
3、使用第三方的工具軟體，搭建檢索功能
下面是製作』PHP搜索』功能
准備:
資料庫(mysql):一個資料庫(search),庫裡面一個表(title),表裡面一個欄位(name).
PHP頁面:兩個頁面(index.php search.php)
製作工具：Dreamweaver
開始:
——————————————————
第一步.創建資料庫.(目前大家應該都是用的phpmyadmin來操作資料庫的吧?)
建立一個資料庫.
第二步.建表
在剛建立的search資料庫里插入一個名字為title的表.建表時讓你選插入幾個欄位.寫1就可以了.
第三步.建欄位
插入的欄位命名為name,長度值20就可以了.
—–資料庫部分已經做完,接下來是網頁部分—–
第四步.建立兩個頁面
建立兩個文件:index.php和search.php可以使用記事本等文本工具直接建立.我使用的工具是Dreamweaver(方便嘛.呵呵).
第五步.index.php的頁面製作.
這個頁面是用來傳遞你搜索的關鍵字的.代碼如下:
<form method=」post」 action=」search.php」 name=」search」>
<input name=」search」 type=」text」 value=」" size=」15″> <input type=」submit」 value=」Search」>
</form>
這段代碼是建立一個FORM表單.專門用來提交數據的.
第一行是FORM表單的開始.它的傳遞方式是post,傳遞到search.php這個頁面.表單名為name.
第二行是文本域和提交按鈕.文本域命名為search,按鈕默認就可以了.
第三行是FORM表單的結束語句.
第五步.search.php的頁面製作.
這個頁面很關鍵.因為他是獲取index頁面傳遞過來的值,然後導出搜索的數據.
首先要綁定你建立的search資料庫,我用的DW生成的.
上一個頁面傳送的文本域是search.所以,這里需要建立一個search變數.來接收你輸入的關鍵詞.用以下語句定義變數:
<?php
$searchs = $_POST['search'];
?>
然後建立一個記錄集,選擇高級.SQL語句中填寫:
SELECT *
FROM title
WHERE name like 『%$searchs%』
這句的意思是選擇title表裡面的所有欄位（*），然後查詢name中的$searchs變數。這個變數也就是你在index中輸入的值啦。
然後在BODY裡面綁定一個動態文本。選擇NAME。
—–網頁部分完成.真個搜索功能也就完成了—–
⑩ 怎麼樣實現前端實現動態添加input框 並做模糊搜索功能
1
<input type="text" autocomplete="on">
input 的autocomplete屬性默認是on，但某些瀏覽器還是需要你手動寫上默認值才有效，其含義代表是否讓瀏覽器自動記錄之前輸入的值，off：則關閉記錄。該功能十分垃圾，交互讓人詬病不已，每次必須提交刷新後才能記住存入歷史，不推薦，垃圾。
原生基礎上增強交互
我並不是說去改變autocomplete="on"的原生功能，而是通過另一種方式實現我們想要的效果，首先我們要准備一個輸入時候出現下面那個下拉框可選性，那麼這個東西其實原生是有的，並不需要我們去自己寫，如下：
1
2
3
4
5
<input type="text" class="form-control" id="phone_number" value="1876487748" placeholder="請輸入手機號碼/imei/accid" list="cars">
<datalist id="cars">
<option value="17314459887"></option>
<option value="1876487748"></option>
</datalist>
動態緩存
上面已經做好了模型，但並不能實現動態記憶，而是寫死的兩個，很顯然，我們需要用到本地緩存，將我們每次提交查詢的值push到當前datalist的數據中去
1
2
3
4
5
6
7
8
9
10
11
// 提交之前先判斷需不需要存儲，如果當前數據中已經存在的，那麼不去重復添加
var dataInput = $('#phone_number').val();
var locData = JSON.parse(localStorage.getItem('dataList'));
if (!locData || !locData.includes(dataInput)) {
if (!locData) {
localStorage.setItem('dataList', JSON.stringify([dataInput]));
} else {
localStorage.setItem('dataList', JSON.stringify(locData.concat([dataInput])));
}
}
scope.addDataList();
1
2
3
4
5
6
7
8
9
10
11
12
13
// 通過jq將數據插入到datalist中
addDataList: function() {
var opt = '';
var locData = JSON.parse(localStorage.getItem('dataList'));
if (locData.length > 15) {
locData = locData.slice(locData.length - 15, locData.length);
}
console.log('locData', locData);
for (var i = 0, len = locData.length; i < len; i++) {
opt += '<option value="' + locData[i] + '">';
}
$('#cars').html(opt);
}