Javascript 浏览器窗口顶部和底部的动态覆盖

我试图弄清楚如何使用JavaScript和jQuery动态创建两个

元素，并将一个元素覆盖在浏览器窗口的顶部，另一个元素覆盖在底部，两者的宽度都等于浏览器窗口的宽度

我真的不知道如何处理这个问题，所以我想我只需要问两个主要问题：

是否有方法获取浏览器窗口的尺寸并使用该尺寸定位覆盖

在创建静态定位的元素时，如何将它们插入DOM中，使其不会改变页面的任何其他部分

谢谢你的提示

/

变量$win=$（窗口）， $width=$win.width（）， $height=$win.height（）

---

$（正文）。追加（div）；好的，谢谢。不幸的是，

position

似乎只给出了顶部和左侧的坐标。它没有给我宽度或高度。那就把它展开吧！var$win=$（窗口），$pos=$win.position（），$top=$pos.top，$width=$win.width（），$height=$win.height（）；谢谢，但这不符合我刚才所说的，即

position（）

提供了宽度或高度。根据“返回一个包含属性top和left的对象”。但我发现我可以使用

$（window）.width（）

和

$（window）.height（）

。在您最初的语句中，您确实提到了获取浏览器窗口的尺寸，但也提到了相对于该窗口定位覆盖。我一定是误会了，我以为你们两个都在找。不管怎样，我在之前的评论中给出的例子表明：；如果您使用$（window）两次，请在变量中捕获它，并请求该变量的宽度/高度。我编辑了我的原始答案以进行反思。