模擬百度搜尋 1

2021-08-20 21:32:01 字數 1278 閱讀 1021

lang="en">

charset="utf-8">

title>

* .box

ulli

:hover

input

button

style>

head>

class="box">

type="text"/>

索搜button>

div>

//需求:輸入內容(輸入事件,鍵盤彈起事件),模擬伺服器獲取內容,建立ul,並在其中顯示。

//步驟:

//1.獲取事件源

//2.繫結事件

//3.書寫事件驅動程式

//1.獲取事件源

//模擬伺服器獲取內容

var arr = ["a","ab","abc","abcd","aa","aaa"];

var box = document.getelementsbytagname("div")[0];

var inp = box.children[0];

// var inp = document.getelementsbytagname("input")[0];

//2.繫結事件(輸入內容(輸入事件,鍵盤彈起事件))

inp.onkeyup = function

() }

var str = newarr.join("");

//bug1.每次建立新的ul之前,先刪除舊的ul

//只有ul存在我們才能刪除ul

// var aaa = box.getelementsbytagname("ul")[0];

if(box.children[2])

//bug2.如果input中內容為空,那麼久不能在生成ul了。

//如果input為空,那麼切斷函式

//bug3.如果arr陣列中沒有以input為開頭的元素。那麼切斷函式

//newarr的長度為0,就能證明以input內容為開頭的元素,在arr中不存在

if(this.value.length === 0 || newarr.length === 0)

//3.書寫事件驅動程式

var ul = document.createelement("ul");

//把建立好的內容新增到ul中。

ul.innerhtml = str;

}script>

body>

html>

模仿百度搜尋

中國春節網 歡迎光臨中國春節網,您現在的位置是中國春節網首頁!年獸 的傳說 熬 年的傳說 萬年建立歷年說 中國 倒貼福字 除夕夜歡迎光臨中國春節網,您現在的位置是中國春節網首頁!年獸 的傳說 熬年的傳說 萬年建立歷年說 中國 倒貼福字 除夕夜.中國春節網 歡迎光臨中國春節網,您現在的位置是中國春節網...

百度搜尋技巧

例子 電影 qvod 查詢詞 電影 在搜尋結果中,qvod 被必需被包含在搜尋結果中。6 site搜尋範圍限定在特定站點中 您如果知道某個站點中有自己需要找的東西,就可以把搜尋範圍限定在這個站點中,提高查詢效率。site 後面跟的站點網域名稱,不要帶 http site 和站點名之間,不要帶空格。7...

百度搜尋技巧

舉例 pan.baidu.com 侏羅紀 把搜尋範圍限定在某乙個 中 site k8s site csdn.net 精準匹配 雙引號和書名號 中國山西大學 如果查詢詞比較長,我們一般加引號,表示不要拆分。手機 如果不加書名號,會出現手機,加了會出現電影 減號語法 在搜尋結果中有些不想要的 linux...