HTML百度頁面的JS代碼是用來控制頁面行為和功能的。其中,該頁面的JS代碼主要是為了實現搜索框的聯想搜索、熱門搜索和搜索歷史記錄的功能。
// 搜索框聯想搜索 function searchSuggest() { // 獲取輸入的關鍵詞 var keyword = document.getElementById('search-input').value.trim(); // 發起AJAX請求,獲取聯想結果 ajax.get('/api/suggest', {q: keyword}, function(result){ // 將結果填充到下拉列表中 var suggestList = document.getElementById('suggest-list'); suggestList.innerHTML = ''; for(var i = 0; i< result.length; i++){ var li = document.createElement('li'); li.innerHTML = result[i]; suggestList.appendChild(li); } // 顯示下拉列表 suggestList.style.display = 'block'; }); } // 熱門搜索 function hotSearch() { // 發起AJAX請求,獲取熱門搜索結果 ajax.get('/api/hotsearch', {}, function(result){ // 將結果填充到頁面中 var hotsearchWrapper = document.getElementById('hotsearch-wrapper'); hotsearchWrapper.innerHTML = ''; for(var i = 0; i< result.length; i++){ var a = document.createElement('a'); a.innerHTML = result[i]; a.href = '/search?q=' + result[i]; hotsearchWrapper.appendChild(a); } }); } // 搜索歷史記錄 function searchHistory() { // 獲取本地存儲中的歷史記錄 var history = JSON.parse(localStorage.getItem('searchHistory') || '[]'); // 將歷史記錄填充到頁面中 var historyWrapper = document.getElementById('search-history-wrapper'); historyWrapper.innerHTML = ''; for(var i = 0; i< history.length; i++){ var a = document.createElement('a'); a.innerHTML = history[i]; a.href = '/search?q=' + history[i]; historyWrapper.appendChild(a); } }
通過這些JS代碼,HTML百度頁面實現了搜索框聯想搜索、熱門搜索和搜索歷史記錄的功能,為用戶提供了更全面、更方便的搜索體驗。