用另一个覆盖任意元素

问题描述：

我想用另一个元素覆盖现有的任意元素。我发现的所有现有答案都要求将要覆盖的元素具有相对位置。但是，我不能控制这一点。用另一个覆盖任意元素

例如，给定一个p元素，我想用div元素完全覆盖它。 p元素可能没有相对位置。

这可能吗？如果是这样，我怎么能实现这个（最好没有jQuery）？

谢谢！

所以你不能调整样式来添加相对位置吗？ – epascarello

它是否必须是一个独特的元素？ ergo，no'：before'或'：after' tricks – Roberrrt

@epascarello我担心这可能会改变页面，这不是我被允许做的事情。我试图在Chrome开发人员工具上“突出显示”某个元素，而无需更改相关页面。 – mikeecb

答

感谢@epascarello。

var elementToCover = ...; 
var rect = elementToCover.getBoundingClientRect(); 

var overlayElement = document.createElement("div"); 

overlayElement.style.position = "absolute"; 
overlayElement.style.zIndex = "999"; 
overlayElement.style.top = rect.top + "px"; 
overlayElement.style.left = rect.top + "px"; 
overlayElement.style.width = (rect.right - rect.left) + "px"; 
overlayElement.style.height = (rect.bottom - rect.top) + "px";

用另一个覆盖任意元素

相关推荐