效果圖:
功能思路分析:
分頁就是將所有的資料按指定條數分成若干份: 假如有24條資料，每頁只顯示5條，則需要分成math.ceil(24 / 5) = 5頁; 每次只顯示1頁資料，所以需要在總資料中利用slice截取出1頁資料渲染
每一頁的資料分布如下:
第一頁: 顯示1 - 5條資料 擷取 data.slice(0,5)
第二頁: 顯示6 - 10條資料 擷取 data.slice(5,10)
第三頁: 顯示11 - 15條資料 擷取 data.slice(10,15)
總結:擷取資料的開始下標為 : **( ** 頁碼-1)*條數
擷取資料的結束下標為 : 開始下標+條數
1. 物件導向框架
2. 資料渲染
\1. 封裝乙個render()方法寫渲染，每次渲染的資料不同，通過傳參獲取
\2. 通過**map().join(『』)**渲染到指定盒子中
**3. ** 頁碼渲染
1.封裝乙個**renderpage()**方法，拿到總頁碼，總頁碼 = 資料總條數/每頁條數
2.使用for迴圈渲染頁碼
3.設定當前頁碼高亮
**4. ** 頁碼切換
1.在各種事件中，都需要根據擷取的資料，重新呼叫渲染資料和渲染頁碼方法，所以封裝乙個公用的use方法集中呼叫
2.給頁碼大盒子繫結點選事件，利用事件委託找到每乙個切換分頁按鈕
5.點選分頁器，當前頁碼 = 事件源.innerhtml，呼叫渲染方法，傳遞資料
5. 條數切換
給條數下拉列表繫結change事件，改變後重新呼叫渲染，修改當前頁碼為1
6. 排序
1.給排序下拉列表繫結change事件,使用sort()方法進行排序
2.根據下拉列表的value值進行排序
3.等級是字母需要利用charcodeat()轉碼後排序
4.排序後重新呼叫渲染方法
7. 模糊搜尋
\1. 給文字框繫結失去焦點事件blur，根據文字框的內容去篩選資料(filter())
\2. 根據篩選後的資料重新呼叫渲染方法
\1. 分頁中擷取資料的開始下標為 : **( ** 頁碼-1)*條數
\2. 分頁中擷取資料的結束下標為 : 開始下標+條數
\3. 分頁中獲取頁碼: math.ceil(總條數/每頁條數)
\4. 陣列方法: **filter() ** 篩選 slice()擷取 sort()排序
\5. 查詢字串返回布林值: includes()
效果圖:
功能思路分析:
\1. 自己模擬資料，渲染選單和列表（每道菜的資訊需要包括：，標題，**）
\2. 點選每一道菜出現彈窗，彈窗內顯示對應的、菜名和價錢（漸隱漸現的動畫效果，通過修改opacity實現）
\3. 彈框是用物件導向封裝好的，此處只需要new例項化呼叫
\4. 點選**，按照**從高到低對資料進行排序（sort()）
\5. 再次點選，按照**從低到高進行排序
閉關日記 Day18
陰。好幾天沒更新日記了，說一下這幾天完成的事和正在做的事。專案f基本完結，專案b在除錯相容 360瀏覽器缺省會進入相容模式來渲染 練車 1號考科三 翻譯 uwp設計指南 當前進度1 時間碎片管理的uwp著手開發 專案t 另外，乙個學長想讓我幫忙做乙個h5小遊戲，在溝通中。target 003 時長 ...
前端學習Day18
一 3d的旋轉 增加了rotatez 和 rotate3d x,y,z,度數 注 x y z 它們是乙個向量值，0是不旋轉，1是旋轉 eg rotate3d 1,1,0,45deg 等價於 rotatex 45deg rotatey 45deg 二 3d的縮放 增加了 scalez 和 scale3...
Day 18 解析資料
day 18 正規表示式解析資料用正規表示式的方式來提取資料，在此不在贅述 補充一些正規表示式常用的符號 beautifulsoup解析資料 from bs4 import beautifulsoup 匯入第三方庫，注意大小寫 根據網頁內容建立解析器物件 格式為 beautifulsoup 網頁資料...