关于使用 JavaScript 定位 DOM 元素的基本问题答案

【问题标题】：Basic question about positioning DOM elements with JavaScript关于使用 JavaScript 定位 DOM 元素的基本问题
【发布时间】：2009-08-15 23:51:08
【问题描述】：

我最近开始学习 JavaScript 以及如何操作 DOM 元素。到目前为止，一切都很棒，我真的很喜欢学习。

但是，有些事情我很难掌握。它是用 JavaScript 定位元素。所有的偏移量、clientsX(Y) 和其他的都让我很困惑。这让我很沮丧，因为我对 HTML 和 css 的了解非常好，而且我还想学习并控制 JavaScript 的定位。

在这里写这个问题之前，我在谷歌上进行了非常广泛的搜索，并在 20-30 个示例之间进行了红色搜索（这里不是开玩笑）。

我想得到的答案是互联网上一些文章的链接，其中用普通语言解释了使用 JavaScript 定位元素的概念。

我写在这里是因为我对自己无法理解它感到非常沮丧。

提前致谢。

【问题讨论】：

【解决方案1】：

This email 可能会有所帮助。不知道你是不是在google上看到的。它开始讨论 CSS 的位置，但如果你往下读，你会看到 JavaScript。

希望这会有所帮助；-)

【讨论】：

【解决方案2】：

通过 javascript 在页面上定位 dom 元素的最简单方法是操作元素的内联样式。

例如，假设我想使用 javascript 将 div 移动到距离顶部 20px 和左侧 100px 的位置，您只需执行此操作即可。

var myDiv = document.getElementById('myDiv');
myDiv.style.position = 'absolute';
myDiv.style.top = '20px';
myDiv.style.left = '100px';

这应该在您的浏览器窗口中将其移动到 100,20。所有的 CSS 规则都适用于此，因此这将适用于您现有的 CSS 知识。

大多数 javascript 框架都支持这个基本功能，YUI 有一个特别有用的 DOM 对象。 JQuery 可能也可以，但由于我不是 JQuery 方面的专家，所以我将引导您使用 YUI 的 Dom 对象。

【讨论】：