一、前言
這篇文章主要是講跟頁面中焦點相關的東西，算是一個小的總結，目測應該沒有比我更無聊的人會去寫這方面東西把~
二、正文
本文希望精簡一點，所以用問答形式來寫把。
問題一:頁面載入完成時，瀏覽器焦點在什么位置？
這個問題很大程度取決於瀏覽器。我測試了一些瀏覽器發現。
1: 在Chrome中，焦點默認在body上面。
2: 在IE中，焦點應該是在瀏覽器上面而不是頁面上。（IE不同版本之間貌似還有差別，不過我沒有具體去研究）
那么，如果設置默認的焦點位置呢？
方法一: 通過Javascript來設置
document.getElementById("ele").focus();
這樣，ID為ele的元素就會獲得焦點，一個常見的需求就是讓頁面的一個input默認獲得焦點，通過這句話就可以解決。
方法二: 使用HTML5定義的新屬性autofocus
為元素加上autofocus屬性可以讓其自動獲得焦點，兼容現代瀏覽器和IE10+
<input type="text" autofocus />
就像這樣，這個input在頁面載入后會自動獲得焦點。
之后，焦點的位置基本取決於你鼠標點擊的位置，大部分情況下會是在body或者一些表單元素上面
問題二:tabindex屬性是干嘛的?
相信很多人看到過這個屬性，但是都是一帶而過。簡而言之，tabindex是用來控制焦點切換順序的。
很多時候，我們會用到焦點完全是用TAB鍵的時候，而tabindex屬性就是決定你用tab鍵切換焦點時候的順序。
舉個例子
<input value="1" type="text" tabindex="1"> <input value="4" type="text" tabindex="4"> <input value="2" type="text" tabindex="2"> <input value="3" type="text" tabindex="3">
比如上面這段代碼，本來你用tab鍵切換焦點時，是按照HTML的順序來的。但是如果你設置了tabindex，那么焦點切換順序將會是按照tabindex的值的大小來的。其實關於這個tabindex，司徒正美的這篇博客講的很詳細了，就不多說了。
問題三:如何知道當前焦點在哪個元素上?
怎么知道當前焦點在哪里呢，雖然很少情況需要知道這個，但是DOM還是提供了接口去得到這個。
那就是通過document.activeElement來實現，這個屬性可以得到當前焦點的DOM元素的引用，具體可以看文檔，兼容性良好。
在jQuery中，也可以通過
$("*:focus") //獲得焦點的元素
$("input:focus") //獲得焦點的input元素
類似這樣代碼去得到。
轉載本站文章請注明作者和出處 奇葩一朵朵 – http://www.cnblogs.com/season-huang/ ，請勿用於任何商業用途