Javascript 更改样式属性

我有一个元素，其中应用了以下样式：

<style>
    #hover  {
      border: 1px green;
      position: absolute;
      left: -100px; /* Should not be seen initially */
    }
</style>

更改属性：

hover=document.getElementById("hover");
left=window.getComputedStyle(hover,null).getPropertyValue("left");

hover.style.left="25px";

我发现这种看似不对称的现象相当令人费解。例如，以下操作不起作用：

读取属性-不会以这种方式工作，始终返回空字符串

left=hover.style.left

更改属性-会出现错误“此对象中不允许修改”

computedStyle = window.getComputedStyle(hover,null);
computedStyle.setProperty("left",'-101px','important');

我知道我的最后一次尝试甚至是不完整的；在创建了一个新的样式对象之后，我需要知道如何将它放回元素，但是在调用setProperty时已经出现了错误消息

---

现在我的问题是：获取和设置样式属性的唯一方法是像我最初做的那样，还是有其他可能实现相同的目标？特别是，我想知道为什么我不能读取带有表达式“hover.style.left”的样式，而只设置它。

元素.style.

映射到直接应用于元素的样式。有两种方法可以做到这一点：

• 通过DOM
• 通过HTML

  style

  属性

您可以从中读取，但它只能读取直接应用于元素的CSS属性。由于属性最初是通过样式表设置的，因此它们不会显示在此处

---

getComputedStyle

以浏览器尝试渲染元素时的相同方式计算元素的样式。它应用样式表中的规则和直接应用于元素的规则，应用级联逻辑等等

你不能给它写信，因为规则来自很多不同的地方

---

---

因此，如果您想从内联或其他地方获取规则，您必须使用

getComputedStyle

，但无论您编写什么，都必须通过

.style.

使用jQuery是否合适？我使用了一点jQuery，但我仍然不太了解它。您介意给我举个例子，看看我的代码在jQuery中是什么样子的吗？