<分区>
标签 javascript html css
<分区>
不知何故，我无法访问我的图像标签应用的过滤器属性。我有一个设置过滤器属性的页面。即，将亮度设置为 200%，应用图像滤镜亮度为 200%。
用于读取输入/设置过滤器值的 JavaScript 代码。在 CSS 中:
img { filter: blur(var(--blur)) grayscale(var(--grayscale)) brightness(var(--brightness)) contrast(var(--contrast)) hue-rotate(var(--hue)) invert(var(--inv)) opacity(var(--opa)) saturate(var(--sat)) sepia(var(--sepia)); }
一切正常。图像随着我的输入而变化。但不知何故，我根本无法读取样式属性。
console.log(document.querySelector("img").style.filter);
或.style
当我这样做时，它显示null(无)...html 文件中只有一个img 标签()。我想知道为什么我无法读取过滤器属性。
最佳答案
这是因为 style属性仅在 HTML 标记的 style 中显示内联样式属性，而不是来自任何样式表或 <style> 的 CSS标签。
为了从样式表中获取样式，您必须使用 window.getComputedStyle 。 :
window.getComputedStyle(document.querySelector("img")).filter
关于javascript - 无法访问 "filter"属性，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42083306/