TypeError: getComputedStyle(...).getPropertyValue 不是函数

这个错误消息通常出现在调用 getComputedStyle 方法时发生，表明该方法的属性获取失败了。getComputedStyle() 方法返回值是一个对象，包含元素的所有计算后的样式。getPropertyValue() 是获取计算后指定样式属性的方法，但是当它出现在不正确的上下文中时，就会引发这个错误。

常见原因

以下是导致出现 TypeError: getComputedStyle(...).getPropertyValue 不是函数 错误消息的一些常见原因：

• 在元素上没有应用样式属性
• 拼写错误，指定不存在的样式属性
• 由于CSS加载失败，某些样式属性未应用于元素
• 尝试对文本节点调用方法，而不是对元素节点调用方法
• 代码片段中DOM元素可能未正确获取

解决方法

这个错误通常可以通过以下方法进行解决：

• 确保样式属性在元素上正确应用
• 仔细检查所请求的属性名称是否正确拼写
• 确保元素上应用了正确的样式表并且已加载
• 检查代码片段中元素节点的正确获取方式
• 确保不会意外地将方法应用于文本节点，而非元素节点。

如果您发现使用上面的方法不能解决问题，可以通过其他途径查找更深入的原因。

示例代码

const element = document.querySelector('#some-element');
const styles = window.getComputedStyle(element);
const width = styles.getPropertyValue('width');
console.log('Width:', width);

在这个例子中，首先获取了一个DOM元素，然后使用getComputedStyle()方法获取元素的样式属性。接下来，尝试获取width属性，以了解元素的实际宽度。如果getComputedStyle()方法在这个上下文中失败，TypeError: getComputedStyle(...).getPropertyValue 不是函数 错误就会显示。