从视口的顶部元素获取颜色

Question

我正在创建一个按钮以转到页面底部，我希望按钮背景色与触摸视口的第一个元素相同。按钮正在工作，但是我无法获得顶部元素的颜色。检查此图像以了解我需要什么。https://i.ibb.co/4SrqGQW/Screenshot-20191018-114922.jpg

我当前的代码

// ==UserScript==
// @name          bottom button 
// @namespace     bottom
// @description   go to bottom
// @include       *://*/*
// @grant         GM_addStyle 
// @noframes
// ==/UserScript==
var btmbtn = document.createElement("div");
btmbtn.innerHTML = '<div id="bottom1">▼</div>';
btmbtn.onclick = function() {
    window.scrollTo(0,document.body.scrollHeight);
};
document.getElementsByTagName("html").item(0).appendChild(btmbtn);
GM_addStyle ( `
#bottom1  {
background-color: blue;
position: fixed;
bottom: 10vw;
right: 2vw;
z-index: 9999999;
border-radius: 100%;
width: 10vw;
height: 10vw;
font-size: 5vw;
text-align: center;
line-height: 10vw;
} 
` );

Answer 1

您可以使用以下命令轻松访问体内的第一个DOM对象var first = document.body.children[0];并访问其样式属性。但是要记住的是，这可能并不总是适合您的情况。例如：-如果您在容器顶部有一个容器或任何其他元素，但不在主体的顶部，则仅在主体在代码中开始后才获得该元素的属性，而不是视口本身的第一个元素。您可以看一下this