javascript - 我的用户脚本不起作用，我不知道为什么（过度使用 var 关键字）

Question

嘿伙计们/姑娘们，我刚刚发现了用户脚本的魅力，我想创建一个。从有限数量的在线教程中，我设法想出了这个。

// ==UserScript== 
// @name My add on
// @description A script that adds a green div to the bottom of the page 
// @include http://*
// @grant none
// ==/UserScript== 
function createDiv(){
var userBar=document.createElement('DIV');
var userBar.style.height='80px';
var userBar.style.width='100%';
var userBar.style.backgroundColor='green';
document.body.appendChild(userBar);
}
createDiv();

这只是一个在页面底部添加绿色 div 的测试脚本。不幸的是，它在实施时什么都不做。

Answer 1

这个问题是因为你总是在前面写 var。您只能在声明期间执行此操作。

这是对的：

function createDiv(){
    var userBar=document.createElement('DIV');
    userBar.style.height='80px';
    userBar.style.width='100%';
    userBar.style.backgroundColor='green';
    document.body.appendChild(userBar);
}

createDiv();

此外，由于您说要在网站底部添加它，您可以在将元素添加到正文之前添加：

userBar.style.position='absolute';
userBar.style.bottom='50px';

Answer 2

尝试这个：

...
var body = document.getElementsByTagName("body")[0];
    body.appendChild(userBar);