Jquery与Javascript：获取css样式的对象显示不同的结果

我有以下代码：

在我的html中

<h1 id="heading">My Site</h1>

当我在控制台时，我会

document.getElementById("heading").style.fontSize

它给出：

但当我这么做的时候

$("#heading").css("fontSize")

它给出：16px

即使打印整个样式对象，vanilla javascript也会显示所有空白值，但jquery会显示正确的结果

---

为什么两者之间有区别？

因为jQuery的css函数提供了计算样式，而Element.style.fontSize只提供了内联应用的样式。与jQuery代码等效的标准是：

var heading = document.getElementById("heading");
window.getComputedStyle(heading).getPropertyValue('font-size');

---

这将在应用任何CSS后为您提供元素的实际字体大小。

因为jQuery的CSS函数为您提供计算样式，而element.style.fontSize只提供已内联应用的样式。与jQuery代码等效的标准是：

var heading = document.getElementById("heading");
window.getComputedStyle(heading).getPropertyValue('font-size');

document.getElementById("heading").style.fontSize

在应用任何CSS后，这将为您提供元素的实际字体大小

document.getElementById("heading").style.fontSize

将仅获取内联设置的样式，如：

<h1 id="heading" style="font-size:16px">My Site</h1>`

使用内嵌样式：

console.logdocument.getElementByIdheading.style.fontSize 我的网站 将仅获取内联设置的样式，如：

<h1 id="heading" style="font-size:16px">My Site</h1>`

使用内嵌样式：

console.logdocument.getElementByIdheading.style.fontSize

---

我的站点相关-jquery是javascript，jquery是javascript，jquery是javascript。。。。。。。如果您想知道jquery是如何做的，那么很容易找到它！因为所有jquery都是一个围绕常规javascript函数的库。。。。。。。如果您想知道jquery是如何做的，那么很容易找到它！因为所有jquery都是一个围绕常规javascript函数的库。对不起，我无意编辑您的问题。“回滚我的更改。@马蒂斯：谢谢你的澄清，非常感谢抱歉-我不是有意编辑你的问题。马蒂斯：非常感谢你的澄清appreciated@jo8691：感谢您的澄清和MDN链接。很appreciated@jo8691：感谢您的澄清和MDN链接。非常感谢