To find the highest
z-index values. The element with the highest
z-index value will be the one that appears on top of all other elements.
z-index property in CSS controls the stacking order of overlapping elements on a page. An element with a higher
z-index value will appear in front of an element with a lower
z-index value. To set an element behind another element, add a negative value like
Practical code example for finding highest z-index
z-index used on the page. You can limit searching by providing CSS
selector argument to select elements you want to verify.
You can also use the
document.elementsFromPoint() method to get all elements at a given point on the page and use that instead of
Array.from(document.querySelectorAll(selector || "body *")).
Can this method be modified to work with iframes or shadow DOM?
Yes, the method can be modified to work with iframes or shadow DOM. However, due to security reasons, scripts running on a page do not have direct access to the content inside an
However, if you have control over the
iframe or Shadow DOM, you can write a similar function inside the iframe or shadow DOM and call it from the main document.