我需要获取 :after
并将其分配给变量。有可能吗?
querySelectorAll
不起作用。
alert(some_div_with_pseudo.querySelectorAll('::after')[0]) // undefined
最佳答案
简短的回答是你不能。还没有。
JavaScript 可以访问 DOM,它是在从 HTML 加载页面时构建的,并在 JavaScript 操作它时进一步修改。
伪元素 由 CSS 生成,而不是 HTML 或 JavaScript。它的存在纯粹是为了给 CSS 一些可以依赖的东西,但这一切都是在 JavaScript 毫不知情的情况下发生的。
这是应该的。在总体方案中,页面以 HTML 开始。 JavaScript 一方面可以用来修改它的行为和操作内容,另一方面 CSS 可以用来控制结果的呈现:
HTML [→ JavaScript] → CSS → Result
您会看到带有伪元素的 CSS 位于末尾,因此 JavaScript 看不到。
另见:
- > https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector#Usage_notes
- > https://www.w3.org/TR/selectors-api/#grammar
编辑
似乎在现代 JavaScript 中有一个使用 window.getComputedStyle(element,pseudoElement)
的解决方法:
var element = document.querySelector(' … ');
var styles = window.getComputedStyle(element,':after')
var content = styles['content'];
关于javascript - 如何获取伪元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59688526/