使用document.activeElement，所有主要浏览器都支持它。

以前，如果您试图找出哪个表单字段具有焦点，则无法做到。要模拟旧浏览器中的检测，请向所有字段添加一个“焦点”事件处理程序，并将最后一个焦点字段记录在变量中。添加一个“blur”处理程序，以在最后一个聚焦场发生模糊事件时清除变量。

如果需要删除activeElement，可以使用blur；document.activeElement.blur（）。它会将activeElement更改为body。

相关链接：

activeElement浏览器兼容性document.activeElement的jQuery替代项

正如JW所说，您无法找到当前关注的元素，至少以独立于浏览器的方式。但如果你的应用程序仅为IE（有些是…），你可以通过以下方式找到它：

document.activeElement

看起来IE并没有什么问题，毕竟这是HTML5草案的一部分，似乎至少得到了最新版本的Chrome、Safari和Firefox的支持。

把这个放在这里是为了给出我最终想出的解决方案。

我创建了一个名为document.activeInputArea的属性，并使用jQuery的热键插件来捕获箭头键、tab和enter的键盘事件，我还创建了用于单击输入元素的事件处理程序。

然后，每次焦点改变时，我都会调整activeInputArea，这样我就可以使用该属性来查找我所在的位置。

不过，这很容易搞砸，因为如果你的系统中有一个bug，并且焦点不在你认为的位置，那么很难恢复正确的焦点。

我在Mootools中使用了一个小助手：

FocusTracker = {
    startFocusTracking: function() {
       this.store('hasFocus', false);
       this.addEvent('focus', function() { this.store('hasFocus', true); });
       this.addEvent('blur', function() { this.store('hasFocus', false); });
    },

    hasFocus: function() {
       return this.retrieve('hasFocus');
    }
}

Element.implement(FocusTracker);

通过这种方式，您可以使用el.hhasFocus（）检查元素是否具有焦点，前提是对给定元素调用了startFocusTracking（）。

我喜欢Joel S使用的方法，但我也喜欢document.activeElement的简单性。我使用了jQuery并将两者结合起来。不支持document.activeElement的旧浏览器将使用jQuery.data（）来存储“hasFocus”的值。较新的浏览器将使用document.activeElement。我认为document.activeElement将具有更好的性能。

(function($) {
var settings;
$.fn.focusTracker = function(options) {
    settings = $.extend({}, $.focusTracker.defaults, options);

    if (!document.activeElement) {
        this.each(function() {
            var $this = $(this).data('hasFocus', false);

            $this.focus(function(event) {
                $this.data('hasFocus', true);
            });
            $this.blur(function(event) {
                $this.data('hasFocus', false);
            });
        });
    }
    return this;
};

$.fn.hasFocus = function() {
    if (this.length === 0) { return false; }
    if (document.activeElement) {
        return this.get(0) === document.activeElement;
    }
    return this.data('hasFocus');
};

$.focusTracker = {
    defaults: {
        context: 'body'
    },
    focusedElement: function(context) {
        var focused;
        if (!context) { context = settings.context; }
        if (document.activeElement) {
            if ($(document.activeElement).closest(context).length > 0) {
                focused = document.activeElement;
            }
        } else {
            $(':visible:enabled', context).each(function() {
                if ($(this).data('hasFocus')) {
                    focused = this;
                    return false;
                }
            });
        }
        return $(focused);
    }
};
})(jQuery);

JQuery目前不支持：focus伪类。如果您在JQuery文档中查找它，请在“Selectors”下检查它指向W3C CSS文档的位置。我已经用Chrome、FF和IE 7+进行了测试。注意，要使其在IE中工作，<！DOCTYPE。。。必须存在于html页面上。下面是一个示例，假设您为具有焦点的元素分配了一个id：

$(":focus").each(function() {
  alert($(this).attr("id") + " has focus!");
});

阅读其他答案，并尝试自己，看起来document.activeElement将为您提供大多数浏览器所需的元素。

如果你有一个不支持document.activeElement的浏览器，如果你有jQuery，你应该可以在所有焦点事件中使用类似这样的简单方法（未经测试，因为我手头没有一个满足这些条件的浏览器）来填充它：

if (typeof document.activeElement === 'undefined') { // Check browser doesn't do it anyway
  $('*').live('focus', function () { // Attach to all focus events using .live()
    document.activeElement = this; // Set activeElement to the element that has been focussed
  });
}

如果您可以使用jQuery，它现在支持：focus，只需确保您使用的是1.6+版本。

此语句将为您提供当前关注的元素。

$(":focus")

From：如何使用jQuery选择关注它的元素

document.activeElement现在是HTML5工作草案规范的一部分，但在一些非主流/移动/旧浏览器中可能还不支持它。您可以返回到querySelector（如果支持）。还值得一提的是，如果没有元素聚焦，document.activeElement将返回document.body，即使浏览器窗口没有聚焦。

下面的代码将解决这个问题，并返回到querySelector，提供更好的支持。

var focused = document.activeElement;
if (!focused || focused == document.body)
    focused = null;
else if (document.querySelector)
    focused = document.querySelector(":focus");

另外需要注意的是这两种方法之间的性能差异。使用选择器查询文档总是比访问activeElement属性慢得多。请参阅此jsperf.com测试。

对于dojo，可以使用dijit.getFocus（）

如果您使用的是jQuery，可以使用它来确定元素是否处于活动状态：

$("input#id").is(":active");

如果没有聚焦元素，document.activeElement可以默认为＜body＞元素。此外，如果元素被聚焦并且浏览器窗口被模糊，activeElement将继续保持聚焦元素。

如果这两种行为中的任何一种都不可取，请考虑一种基于CSS的方法：document.querySelector（“：focus”）。

使用document.activeElement可能存在问题。请考虑：

<div contentEditable="true">
  <div>Some text</div>
  <div>Some text</div>
  <div>Some text</div>
</div>

如果用户关注内部div，那么document.activeElement仍然引用外部div。您不能使用document.active Element来确定哪个内部div具有焦点。

以下函数绕过此问题，并返回聚焦节点：

function active_node(){
  return window.getSelection().anchorNode;
}

如果您希望获得焦点元素，请使用：

function active_element(){
  var anchor = window.getSelection().anchorNode;
  if(anchor.nodeType == 3){
        return anchor.parentNode;
  }else if(anchor.nodeType == 1){
        return anchor;
  }
}

如果要获取Element实例的对象，必须使用document.activeElement，但如果要获取Text实例的对象则必须使用document.getSelection（）.focusNode。

我希望能有所帮助。

如果文档没有聚焦，document.activeElement本身仍然可以返回一个元素（因此文档中的任何内容都没有聚焦！）

您可能想要这样的行为，或者这可能无关紧要（例如，在keydown事件中），但如果您需要知道某些事情实际上是聚焦的，您可以另外检查document.hasFocus（）。

如果有聚焦元素，则以下内容将为您提供聚焦元素，否则为空。

var focused_element = null;
if (
    document.hasFocus() &&
    document.activeElement !== document.body &&
    document.activeElement !== document.documentElement
) {
    focused_element = document.activeElement;
}

要检查特定元素是否具有焦点，更简单：

var input_focused = document.activeElement === input && document.hasFocus();

要检查是否有任何内容被聚焦，这又一次变得更加复杂：

var anything_is_focused = (
    document.hasFocus() &&
    document.activeElement !== null &&
    document.activeElement !== document.body &&
    document.activeElement !== document.documentElement
);

健壮性注意：在对document.body和document.documentElement进行检查的代码中，这是因为某些浏览器在没有焦点时返回其中一个或null。

它不考虑＜body＞（或者＜html＞）是否具有tabIndex属性，因此实际上可以被聚焦。如果您正在编写一个库或其他东西，并且希望它是健壮的，那么您可能应该以某种方式处理它。

这里有一个（重引号）“单行”版本的获取聚焦元素，这在概念上更复杂，因为你必须了解短路，而且你知道，如果你想让它可读，它显然不适合一行。我不推荐这个。但如果你是1337 hax0r，idk。。。就在那里。如果您不介意在某些情况下出错，也可以删除||null部分。（如果document.activeElement为null，则仍可能为null）：

var focused_element = (
    document.hasFocus() &&
    document.activeElement !== document.body &&
    document.activeElement !== document.documentElement &&
    document.activeElement
) || null;

为了检查某个特定元素是否聚焦，您也可以使用事件，但这种方式需要设置（并且可能需要拆除），并且重要的是，假设初始状态：

var input_focused = false;
input.addEventListener("focus", function() {
    input_focused = true;
});
input.addEventListener("blur", function() {
    input_focused = false;
});

您可以通过使用非事件方式修复初始状态假设，但也可以使用它。

我发现，当试图确定哪个元素当前具有焦点时，以下代码片段非常有用。将以下内容复制到浏览器的控制台中，它将每秒打印出具有焦点的当前元素的详细信息。

setInterval(function() { console.log(document.querySelector(":focus")); }, 1000);

如果打印出整个元素不能帮助您精确定位元素，请随意修改console.log以注销不同的内容，以帮助您精确地定位元素。

简单地使用document.activeElement查找当前活动元素

如果您想在开发工具上测试重点元素，我建议使用。

$(":focus")

当您单击开发工具中的任何内容时，As document.activeElement将变为body。

要获取上一个活动元素，请添加此。

示例：单击一个按钮，需要上一个活动元素。因为按钮一旦点击就会获得焦点。

document.addEventListener("focusout",ev => {
  document.previousActiveElement = ev.target;
});

使用document.activeElement.id

appending.id过滤掉返回的整个DOM，并允许您仅处理已标识的元素