Focusable

HTML 元素中，並不是所有元素都可以獲得焦點，有如下元素可以獲得焦點: a, area, button, input, object, select, textarea，這些元素就是 focusable 元素。

而除了上述元素之外，還可以通過如下方式使元素變為 focusable 元素：

• 設定了 tabindex 屬性的元素
• 設定了 contenteditable="true" 屬性的元素

要想一個 focusable 元素獲得焦點，則有三種方式：

• 使用滑鼠點選元素
• 呼叫元素的 focus() 方法
• 通過 Tab 鍵進行卻換

tabindex

tabindex 的一大作用就是讓元素可以獲得焦點，從而觸發 focus 狀態。給聯絡人列表的元素 li 都加上該屬性後，我遇到的問題也就解決了。

tabindex 的另一個作用，就是設定 Tab 鍵切換的順序。tabindex 有如下幾個值:

• 1 ~ 32767: 通過 Tab 鍵切換時，切換順序將遵循數字的大小(從小到大)，數字相同則按出現的先後次序進行切換
• 0: 預設值，當 tabindex > 0 的元素都切換之後，才會切換到 tabindex = 0 的元素，並且按出現的先後次序進行切換
• 負數(通常為 -1): 通過 Tab 鍵無法切換到該元素，但滑鼠點選可以獲取焦點