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。

#jquery #SQL #html #Bootstrap







你可能感興趣的文章

{210411} markdown

{210411} markdown

Unreal Webcam Fun

Unreal Webcam Fun

起始點....

起始點....






留言討論