Question

有没有办法提取DOM元素的渲染信息，如位置，字体，颜色等？例如，HTML文件可能不指定标签的坐标，但Web浏览器引擎将以某种方式计算它们的位置和相对大小。我想知道如何让程序访问信息

我知道我可以手动访问渲染信息，例如，使用Google Chrome中的“Inspect element”，但我想知道是否有任何可编程方式。

由于

PS。我想我必须提供这项任务的背景。我目前正在研究HTML网页中的结构化数据（例如，表格）上的信息提取，并且正在考虑使用视觉信息（例如，表格元素的位置）来提取结构化信息。

Answer 1

JavaScript可以使用someElement.getBoundingClientRect()，它会返回包含left，top，width和height属性的对象。

您还可以使用window.getComputedStyle(someElement)（较旧的IE使用someElement.currentStyle）来获取各种计算的CSS信息。

Answer 2

当然，所有这些信息都可以使用javascript获得。您熟悉jQuery库吗？有一个名为.css（）的jQuery方法，你应该熟悉它。使用jQuery选择器，您可以查询可以选择的任何DOM元素。因此，要找出页面上h1元素的颜色，您可以说

$('h1').css('color');

然后回来

"rgb(0, 0, 0)"

这是jQuery选择器的一个不错的纲要（不是w3学校的忠实粉丝，但这足以让我们开始一瞥：http://www.w3schools.com/jquery/jquery_ref_selectors.asp