Which HTML elements can receive focus?

Having a HTML element to recieve focus isn’t really up to you, But they are ways to get that done, but by ensuring you take note of the requirements below.

There isn’t a definite list, it’s up to the browser. The only standard we have is DOM Level 2 HTML, according to which the only elements that have a focus() method are HTMLInputElement, HTMLSelectElement, HTMLTextAreaElement and HTMLAnchorElement. This notably omits HTMLButtonElement and HTMLAreaElement.

Today’s browsers define focus() on HTMLElement, but an element won’t actually take focus unless it’s one of:

  • HTMLAnchorElement/HTMLAreaElement with an href
  • HTMLInputElement/HTMLSelectElement/HTMLTextAreaElement/HTMLButtonElement but not with disabled (IE actually gives you an error if you try), and file uploads have unusual behaviour for security reasons
  • HTMLIFrameElement (though focusing it doesn’t do anything useful). Other embedding elements also, maybe, I haven’t tested them all.
  • Any element with a tabindex

There are likely to be other subtle exceptions and additions to this behaviour depending on browser.

I hope this was helpful 🙂 .