JavaScript methods and techniques for obtaining pseudo-element (Pseudo-Element) attributes_javascript techniques

CSS pseudo-elements are very useful - you can use it to create CSS triangles, use them on tooltips, and you can also use them to complete many simple tasks without the need for extra HTML elements. Previously, CSS properties of pseudo-elements were not accessible with JavaScript, but now, there is a new JavaScript method to access them! Assume your CSS code looks like this:

Copy code The code is as follows:

.element:before {
content: 'NEW';
color: rgb(255, 0, 0);
}

To get the style attributes in .element:before, you can use the following JavaScript code:

Copy code The code is as follows:

var color = window.getComputedStyle(
document.querySelector('.element'), ':before'
).getPropertyValue('color')

By using the pseudo-element as the second parameter of the window.getComputedStyle method, you can get the attributes in the pseudo-element style! Put this tip into your knowledge base, and as browsers evolve, pseudo-elements will become more and more useful!