Day 81 (Week12), 2021/07/01 (Thursday)
學習時數：8 hr
Done
- hw1 留言板（串API、載入更多）
- Bootstrap、jQuery 複習
To Do @ this week
- hw1 留言板
- hw2 to do list
學習心得紀錄
Objective 客觀
jQuery
一開始怕會忘記指令，就做了一個簡表：
| 指令 | 用法 |
|---|---|
$ | $就是 jQuery 的簡寫。$('.btn-mark') = jQuery('.btn-mark') |
.ready() | $(document).ready(function() {} |
.click() | .click(function(e) {} |
.val | .val()取值。.val('')令值為空字串。.val('abc') 重新賦值為abc |
.append() | .append()：向後新增 |
.prepend() | .prepend()：向後新增 |
.css() | .css('color', 'red'); |
.on() | .on('click', '.class', function(e) {} |
.empty() | 變成空的內容 |
.parent() | 鄰近的元素 |
.fadeOut() | 淡出 |
.fadeIn() | 淡入 |
.text('') | 修改該文字內容。 |
.class系列 | .removeClass()：移除 class。.addClass() ：新增 class。.hasClass()：回傳 boolean 值 |
API 實作
ajax 在 url 的地方不能使用 local 端的 file 路徑，需要使用 localhost 虛擬主機的 path，才能成功發送請求，另外還有跨來源請求的部分，要加 header('Access-Control-Allow-Origin: *'） 表示允許跨域請求。此外還有一直要放在心上的錯誤訊息處理，在串資料、取 SQL 資料、發送請求，都要考慮到若是發生錯誤，要顯示什麼錯誤訊息。
留言板 -- 載入更多
先蓋住檢討影片自己實作一遍，結果自己做出來的載入更多是建立在 SQL 一次把所有資料撈出來，然後再用 JavaScript 寫判斷式寫出來：按一次載入更多，顯示另五筆資料，直到顯示完畢。但看了檢討影片後，發現是另一個新的概念 cursor-based pagination，看到這邊需要花一點時間來理解，所以就明天再來研究跟重做一遍！
感受
這次雖然是使用 jQuery 發送請求，同時也複習了跨域請求跟發 request，還有事件監聽的內容，不一樣的是：使用不一樣的方法寫。
Decisional 決定行動
明天來研究檢討影片的載入更多，然後進入 to do list。
![[JavaScript] ES6：Destructuring 解構](https://nicolakacha.coderbridge.io/2020/09/05/es6-destructuring/?utm_source=coderbridge-com&utm_medium=indie_related_post_img&utm_campaign=Day 81_[JavaScript] ES6：Destructuring 解構_@Nicolakacha_https://static.coderbridge.com/images/covers/default-post-cover-1.jpg)
