Dom的class和焦點管理

前端開膛手發表於2018-05-24

getElementsByClassName()是html的方法,如果想在ie9以下的瀏覽器使用,可以自己封裝方法,首先建立空陣列,然後getElementsByTagName,然後遍歷,看className是否含有目標class。

classList屬性,是一個偽陣列(也是物件),獲得當前節點的所有class,它本身也有四個方法:

add

remove

contains

toggle

上述四個方法只接收一個字串作為引數

如果想增加多個class,可以自己重寫add方法,即使迴圈使用這些方法,也不會迴圈渲染dom,因為js和瀏覽器渲染同時只有一個在工作


在html5增加了一個activeElement屬性,

當你開啟文件期間(未載入完成),指向null

載入完成,指向<body>標籤,也就是documentElement

當你點選某個元素,指向該元素

可以利用只一點,來判斷瀏覽器是否載入完成

在js中可以使用focus方法讓某個元素強制獲得焦點


如何判斷文件是否獲得焦點-----hasFocus,判斷使用者是否正在與網頁進行互動

hasFocus只是document的方法

js中,所有的事件都是基於瀏覽器的,只有瀏覽器處於啟用狀態,事件才可以觸發,比如使用者點選了位址列,就與網頁脫離了互動

啟用狀態:document.hasFocus()返回true

未啟用狀態:document.hasFocus()返回false


焦點管理的意義:

1,讓html開發更加標準化

2,對殘障人士更加友好


相關文章