有鑒於一直寫理論方面的學習方式好像效果不太好
（前面寫錯的部分搞不好被各位 IT 大大在內心鞭之數十驅之別院了囧rz），
因此邊做邊學，日後文章可能練習與理論穿插（我很懷疑我還能不能睡覺…）
如果內容有誤還請不吝指正>_<

今天做的是猜數字的遊戲，輸入一個數字來猜猜我的吧～
網址請點我

以下記錄做法

html：
放個輸入框讓使用者輸入字串，這裡是字串喔！即使輸入的是數字，依然是字串。
按鈕跟字串各給他們一個 id

html 去標籤符號以免被吃掉
input type="text" id="textfield" placeholder="輸入你的數字！"
input type="button" id="btn" value="猜猜看"


JavaScript：
首先設定三個變數，我分別設定了最小值、正確答案以及最大值

var correctNum = 24;
var biggestNum = 100;
var smallestNum = 0;


當頁面讀取完畢後就執行 guessIt() 函式
window.onload = guessIt;

按下按鈕後執行猜猜看的函式。
guessIt() 函式抓取 #btn 的 onclick 事件 –> 執行判斷解答的函式
什麼是getElementById ？

function guessIt() {
document.getElementById('btn').onclick = function(evt) {
guessAnswer();
}
}


輸入數字後按下按鈕，就開始判斷輸入的字串囉！
宣告變數 textNum 抓取 input.textfield 的值後，再將 textNum 值轉成數字。
上面有提到，輸入的即使是數字，但他仍是字串。
什麼是 parseInt() ？
它可以把字串轉成整數，從範例來看只要前面沒有字串，都可以轉成整數
另外一個長得很像的函式叫做 parseFloat(); 則是可以轉成小數點兒

然後判斷輸入字串時的各種場景…一堆 if else 有點頭暈
除了小於等於大於以外，還要判斷輸入字為非字串的處理方式，
在這裏我利用轉不成數字就出現 NaN 特性，條件設定為非數字 (!textToInt) 通通顯示這項訊息 alert(‘這是什麼？可以吃嗎？Ψ(￣∀￣)Ψ’);

以上同步發表於 http://ithelp.ithome.com.tw/ironman7/app/#/article/dev/recent/10157312