1. 设置元素可获得焦点以监听键盘事件 元素聚焦最大好处就是可允许发送键盘事件，HTML很多元素默认就有可聚焦，如form表单元素，a锚链接等，但大部份默认是不能聚焦的。要使得元素能够聚焦，可以在HTML代码或JavaScript脚本中实现。 html: 代码如下: <div tabIndex=”0″ xss=removed></div> [removed] oDiv.tabIndex = 0; 其中tabIndex是TAB键的导航顺序，可有正，负或零。 当元素获得焦点时会有边框指示，如果想不显示这个边框，可以
在JavaScript编程中，捕获和管理页面元素的焦点是一项重要的任务，这主要涉及到用户交互和键盘事件的处理。本文将详细讲解如何有效地设置元素获得焦点以及处理与焦点相关的常见问题。
设置元素可获得焦点是为了能够监听键盘事件。HTML中的某些元素如`<form>`表单元素和`<a>`锚链接默认具有焦点能力，但大部分元素并不具备这一特性。为了使一个元素可聚焦，可以使用HTML属性`tabIndex`。例如：
```html
<div tabIndex="0" style="height:100px;width:100px; background:red;"></div>
```
`tabIndex`值决定了元素在通过Tab键导航时的顺序，它可以是正数、负数或零。正数表示按升序排列，负数表示按降序排列，零则表示按照元素在文档中的顺序。当元素获取焦点时，浏览器通常会显示一个边框，如果你不想显示这个边框，可以使用`hidefocus`属性（在一些旧版本的IE浏览器中有效）：
```html
<div tabIndex="0" hidefocus="on"></div>
```
或者在JavaScript中设置：
```javascript
oDiv.hideFocus = 'on';
```
然而，有时你可能遇到这样的情况：尽管已经设置了元素聚焦，但实际上焦点并没有落在该元素上。这是因为如果你在可聚焦元素的事件处理函数中立即聚焦其他元素，这可能导致聚焦失败。比如在`mousedown`事件中尝试聚焦另一个元素：
```javascript
oDiv.onmousedown = function () {
document.getElementById('ipt').focus();
};
```
在这种情况下，由于浏览器的渲染机制，你需要将聚焦操作放到下一个重绘（Reflow）之后执行，以确保聚焦成功。可以使用`setTimeout`函数实现这一目的，即使设置时间为0也是有效的，因为它将把聚焦操作放入事件队列等待执行：
```javascript
oDiv.onmousedown = function () {
setTimeout(function () {
document.getElementById('ipt').focus();
}, 0);
};
```
需要注意的是，在Internet Explorer浏览器中，如果元素不可见，尝试对其聚焦可能会抛出异常。为了避免这种情况，你可以使用`try...catch`语句来捕获并忽略这个异常：
```javascript
try {
element.focus();
} catch (e) {}
```
总结一下，掌握JavaScript中的焦点管理包括设置`tabIndex`以允许元素聚焦、处理因事件处理导致的聚焦失效问题，以及在某些特定环境下（如元素不可见时）处理可能出现的异常。了解并运用这些技巧，可以让你在创建交互式Web应用时更加得心应手。
