gpt4 book ai didi

firebug - 获取绝对坐标

转载 作者:行者123 更新时间:2023-12-02 00:21:09 25 4
gpt4 key购买 nike

无论 DOM 树的深度如何,我都需要获取 Firebug 检查的任何 DOM 元素的绝对坐标(相对于文档开头的左侧和顶部)。有没有这样的插件?

最佳答案

事实上,您不需要插件,只需要一大块 JavaScript + 一些 Firebug 内部知识。

您可以在 this article 中找到如何获取 DOM 元素的绝对坐标。每个 DOM 元素都有属性 .offsetLeft .offsetTop .offsetParent定义关于其他一些 DOM 元素(offsetParent)的位置。层次结构顶部的元素具有 offsetParent = null .您可以遍历元素及其 offsetParents 在层次结构中向上查找给定元素的绝对坐标。

从该页面复制的代码:

var findpos = function findPos(obj) {
var curleft = curtop = 0;
if (obj.offsetParent) {
do {
curleft += obj.offsetLeft;
curtop += obj.offsetTop;
} while (obj = obj.offsetParent);
return [curleft,curtop];
}
}

(将其粘贴到 Firebug 中,然后控制台中就会有一个可用的 findpos 函数)。

对于大多数最简单的情况,您将有 offsetParent = <body>它具有零偏移量(如屏幕截图所示),因此您无需向 offsetLeft 和 offsetTop 添加任何内容。但是,如果发生相对定位,则必须遍历父级。

当您在 Firebug 中选择一个元素时,它会显示为 $0在 Firebug 控制台中。

因此,在将两者混合后,您可以发出屏幕截图中的命令:

Firebug - finding absolute coords of a node

轻松获取任何元素的绝对坐标。

我上面粘贴的脚本应该适用于绝大多数情况。您可能想阅读 this post也为了更强大的功能。

关于firebug - 获取绝对坐标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10904940/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com