Question

如何使用javascript突出显示html元素，以检查链接到该元素的html和css选择器。突出显示可能只是边框或背景的更改（因此它不会破坏布局）和工具提示，显示连接到该元素的html元素和css选择器。

Answer 1

如果我理解正确的话，听起来你只需要使用类似Firebug的Firefox或开发者工具（F12）来获取IE。每个浏览器都有它们。

它们可以让你突出显示任何内容并使用任何css选择器。绝对必须为Web开发人员提供工具。

Answer 2

你可以这样做：

$('div, a, span, p').hover(function(){
    $(this).css({ "border": "2px solid red" });
    console.log($(this));
},function(){
    $(this).css({ "border": "none" });
});

我会使用Firebug（FF）或控制台（Chrome）来检查元素。

Answer 3

您是否考虑使用像Firebug这样的工具？这样做非常出色，可以显示页面的来源并突出显示鼠标悬停时的元素。此外，在三个主要浏览器（Chrome，FF，IE）的最新版本中，还有一个内置检查器。在FF 10中，右键单击任何内容，然后单击“检查元素”。在Chrome中，过程是一样的。在IE 9中，按F12，然后按Ctrl + B并单击所需的元素。

Answer 4

如果您使用Google Chrome，则可以在View / Developer / Developer Tools中启用开发人员工具。选择此菜单时，浏览器底部将显示带有菜单的框架（此处应单击“元素”按钮）。在此菜单下，您将看到文档的来源。当悬停在浏览器中的某些标签（即:)上时，元素将突出显示，您将能够看到突出显示的标签的属性。

突出显示html元素

4 个答案: