使用HTML、JS等相關Web前端技術基於Android機頂盒開發電視EPG頁面。由於電視端使用遙控器進行焦點控制，我們需要對焦點導航進行處理，使用戶進行便捷 的交互。
在Android開發中有壹個默認的導航規則，開發者設置好相關屬性之後可以通過遙控器導航。在操作遙控器後，它會使當前元素的目標方向上的最近元素獲取焦點。web沒有這樣的規則，我們需要建立壹個類似的規則。對當前獲得焦點元素在使用遙控器操作（上、下、左、右鍵）時，使當前元素在上、下、左、右方向對應的元素獲得焦點。
tabIndex屬性可以設置鍵盤中的TAB鍵在頁面元素中的移動順序,即焦點的順序。默認情況下，普通元素無法獲取焦點，只有鏈接、表單等元素可以獲取焦點。所以普通元素需要設置tabindex屬性，再使用foucs()方法即可。當tabindex的值 >= 0時，可以通過Tab鍵獲取焦點，而tabindex = -1時Tab鍵不能獲取焦點，只能通過JS獲取。當tabindex的值不為-1的時候，使用遙控器操作時焦點獲取位置不符合預期。
註：給元素添加樣式 outline: none; 用於去除默認樣式。
給需要獲取焦點的元素都添加壹個相同的類名，如 class="item"，將需要獲取焦點的元素都篩選出來。
完成上訴步驟後，通過調用focus()方法給目標元素設置焦點。如：
通過 document.activeElement 可以得到當前界面正獲得焦點的元素，十分重要，在建立導航規則後，我們需要通過該元素得到它在各個方向上對應的元素。
我們需要建立這樣壹個規則：當用戶按左鍵時，由當前焦點元素的左邊（合適）元素獲取焦點。同理，按上、右、下鍵時，都有對應方向上合適的元素獲得焦點。
原理：首先獲取當前焦點元素的位置，在與頁面中所有元素的位置進行比較，獲取各個方向上最合適的元素。
可通過下面方法設置或修改，需和html中的class保持壹致
以左方向為例
添加自定義屬性：
nextLeftFocusId 當前元素 左 方向上指定的下壹個焦點元素的id
nextUpFocusId 當前元素 上 方向上指定的下壹個焦點元素的id
nextRightFocusId 當前元素 右 方向上指定的下壹個焦點元素的id
nextDownFocusId 當前元素 下 方向上指定的下壹個焦點元素的id
在HTML中這樣設置：
當該元素獲取焦點時，按上鍵由id為 "nav_item1" 的元素獲取焦點，按右鍵由id為 "img4" 的元素獲取焦點。具體實現如下：
在遍歷計算之前提前返回。
當元素獲取焦點時，我們需要改變它的顯示樣式，來表示它獲取了焦點。
onfocus ：獲得焦點
onblur：失去焦點
如：
再實現search_focus和search_blur兩個方法，可以分別處理獲得焦點和失去焦點的兩種樣式。
設置未獲取焦點的正常狀態樣式：
設置獲得焦點後的樣式：
見： /fengfancky/WebEPG