javascript - (不能)在javascript中获取元素样式的一部分

Question

我是 javascript 的新手(今天开始弄乱它)。

我正在尝试更改名为“bar”的元素(div)的高度。条形图将成为图表的一部分。

我可以毫无问题地将按钮连接到更改栏高度的函数。一切正常，除了条形图是向下而不是像我想要的那样向上增长。

我的解决方案是增加“height”属性，然后减小“top”属性通过高度增加量。

所以我想做这样的事情:

bar.style.height = newHeight;
bar.style.top = bar.style.top - newHeight;

那应该会向上增加高度。问题是我不知道如何获取 bar.style.top 的当前值

在 firebug 中，如果我查看 html 选项卡中的样式，该栏的顶部为

top: 122px;

但在 bar 的观察列表中，我看到的只是值“”(空字符串)bar.style.top.我想我的问题是 - 为什么这些值不匹配，我怎样才能得到我想要的值？

在我询问这些内容时还有另一件事:

我有一些 webkit 的 CSS，看起来像:

-webkit-animation-timing-function: ease-in-out;

例如。我注意到在 bar 的监视列表中，没有 bar.style.-webkit-animation-timeing-function。我如何获取和更改这样的值？

我通常使用 asp.net，我希望有类似的东西

bar.Style["property"] = "value";

我是不是漏掉了什么？

Answer 1

1. 请使用document.getElementById('bar')而不仅仅是 bar ，因为 bar可能意味着很多不同的事情。
2. style属性允许您覆盖任何样式，但只为您提供由 <div style="..."> 设置的样式属性。参见 http://www.quirksmode.org/dom/getstyles.html关于如何获得当前样式。