[JQuery] 替換 document ready 的方法

研究 readyState ,並替換 jQuery $(document).ready 的方法

研究 readyState ,以原生 javascript 的方式去實現!

onreadystatechange
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
console.log(document.readyState);

//監聽,當readystate狀態改變就觸發(loading,interactive,complete)
document.onreadystatechange = function () {

console.log(document.readyState);

if (document.readyState == "loading") {
//這邊一定不會進來,因為網頁一開始狀態就是loading,沒有改變,也不會觸發onreadystatechange
console.log('The document is still loading.');
}
if (document.readyState == "interactive") {
console.log('The document has finished loading and the document has been parsed but sub-resources such as images, stylesheets and frames are still loading.');
}
if (document.readyState == "complete") {
// document is ready. Do your stuff here
console.log('The document and all sub-resources have finished loading. The state indicates that the load event is about to fire.');
}
}

[Jquery] Infinite scroll to load more

在上一篇:[Jquery] use $getJSON
教大家如何撈取json的內容後

這一篇就是延伸上次,做進階練習
首先我們創造一個api.json檔,或者api.js
我試過兩種檔名格式都沒有問題,可以串接無礙

假設我們先創造了api.json檔

key =>"html"
value => "<p style='color:#fff'>我是白色</p>"

api.json
1
{"html": "<p style='color:#fff'>我是白色</p>"}

這邊提醒,由於外面是雙引號(”),所以裡面要用單引號來做區隔(’)

[Jquery] use $getJSON

Json的格式

J森、J桑,傻傻分不清楚
JSON全名:JavaScript Object Notation
就是在JavaScript之中,表示物件的一種格式

重點概念,注意事項

物件(object)用大括號 { }
陣列(array)用中括號 [ ]
整個JSON格式文件{}之中,是不能使用註解的
json object的鍵值(key)(value),建議要用字串做鍵值
記住最後一個key,value 不要再加上 “,
假設你是個初學,不知道什麼是陣列、字串、數字、物件、甚至布林(看這

1
2
//錯誤範例,key 要用" "包起來,讓他成為字串
{0:"hell", 1:"kurt", 2:"jimmy", 3:"Nic",key:"value"}
1
{"0":"hell", "1":"kurt", "2":"jimmy", "3":"Nic"}
Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×