javascript - 是否有浏览器支持或任何插件，当鼠标悬停在元素中时将 html 元素的 ID 或 NAME 显示为工具提示？

Question

我想要一个解决方案similar to this example

$('#field2').attr('title', 'student_Name');

但以另一种方式，正如我在下面解释的那样!

在使用浏览器的开发工具或使用 firebug 插件测试 Web 程序时，检查元素帮助我们了解任何元素id 或名称或整个结构详细信息。

现在，我只想在鼠标悬停在任何元素上时看到显示为工具提示的所选元素 ID 或名称，而无需编写任何 javascript 或 jquery 代码。

此要求是因为，我的网站是日语。
所有标签均以日语文本显示，并且其 id 或 name 属性的名称均为英文(*等于日文翻译成英文例如:学生名 -> 学生姓名*)。

这将有助于轻松找出所选元素的英文名称，而无需将其标签文本翻译为日文名称。
我认为这将帮助许多使用英语以外的语言工作的程序员，例如我!

是否有浏览器工具或插件或任何其他方式可以做到这一点？

Answer 1

您可以为此编写简单的 CSS 调试规则:

label {
    position: relative;
}
label:hover:after {
    content: attr(for);
    position: absolute;
    top: 100%;
    right: 0;
    background-color: rgba(0, 0, 0, .7);
    border-radius: 5px;
    color: #FFF;
    padding: 2px 4px 3px;
}

http://jsfiddle.net/dfsq/zMX5w/1/