javascript - 如何在另一个元素之上创建一个 HTML 元素？

Question

给定一个显示在页面某处的 HTML 元素？

如何制作另一个 html 以使其完全重叠？

为了给出一个想法，我尝试了类似的方法，但如果输入中的 HTML 元素位于页面底部并且我需要向下滚动才能到达它，则它不起作用

function createOverlap(elem) {
    var rect = elem.getBoundingClientRect();
    over.style.position = 'absolute';
    over.style.top =    rect.top+'px';
    over.style.left=    rect.left+'px';
    over.style.height = rect.height+'px';
    over.style.width=   rect.width+'px';
    return over;
}

Answer 1

'over' 似乎不是一个 DOM 元素，除此之外，你非常接近。

看到这个小提琴：http: //jsfiddle.net/7em2g/

function createOverlap(elem) {
    var rect = elem.getBoundingClientRect();
    var over = document.createElement('div');
    over.style.position = 'absolute';
    over.style.top =    rect.top+'px';
    over.style.left=    rect.left+'px';
    over.style.height = rect.height+'px';
    over.style.width=   rect.width+'px';
    return over;
}
var bar = createOverlap(document.getElementById('foo'));
bar.style.backgroundColor = 'rgba(255,0,0,0.3)';
document.body.appendChild(bar);

嗯，如果你向下滚动，这没有什么区别。如果您仍然遇到问题，我们将需要有关该问题的更多信息。