Fatal编程技术网
  • javascript/
  • Javascript 无法读取属性样式错误

Javascript 无法读取属性样式错误

javascript html

Javascript 无法读取属性样式错误,javascript,html,Javascript,Html,我使用nginx和chrome作为浏览器。我只是想改变一个div的背景色，而孤立的JS在一个小提琴中工作。但是完整的标记不起作用 我一直在浏览器控制台中为banner div获取“TypeError:cannotreadproperty'style'of null” <!DOCTYPE html> <html> <head> <!--<meta charset="utf-8"> --> <title>ZZZ lin!<

我使用nginx和chrome作为浏览器。我只是想改变一个div的背景色，而孤立的JS在一个小提琴中工作。但是完整的标记不起作用

我一直在浏览器控制台中为banner div获取“TypeError:cannotreadproperty'style'of null”

<!DOCTYPE html>
<html>
<head>
<!--<meta charset="utf-8"> -->
<title>ZZZ lin!</title>
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
<!-- <link rel="stylesheet" href="/static/global.css" type="text/css"> -->
<style type="text/css">
#banner {
        display:inline;
        position:absolute;
        top:0px;
        left:0px;
        height:40px;
        width:100%;
        background-color:green;
}
</style>
<script type="text/javascript">
var banner_colors = ['#d99b00', '#7f5b00', '#332d0d', '#fffb00', '#888c69', '#9bbf30', '#dbf2b6', '#1f5900', '#59b376', '#00e667', '#004d2d', '#80ffec', '#739993', '#00cbe6', '#263233', '#0095f2', '#1d5273', '#b6dbf2', '#3354cc', '#162559', '#8f93bf', '#2a00e6', '#474359', '#390080', '#5b3973', '#250033', '#b539e6', '#c499cc', '#800071', '#660031', '#d93685', '#8c4668', '#cc002c', '#d9a3ae', '#660009', '#ff808a', '#403031'];
var i = 0, howManyTimes = banner_colors.length;
function f() {
    document.getElementById('banner').style.backgroundColor = banner_colors[i];
    i++;
    if( i < howManyTimes ){
        setTimeout( f, 1000 );
    }
}
document.onload = f();

</script>
</head>
<body>
    <div id="banner">
    </div>
    <div id="main-content">
        <p>Main page content goes here</p>
        <p>Main page content goes here</p>
        <p>Main page content goes here</p>
        <p>Main page content goes here</p>
        <p>Main page content goes here</p>
    </div>
<h1>Hello from Flask!</h1>
</body>
</html>


林志忠！
#横幅{
显示：内联；
位置：绝对位置；
顶部：0px；
左：0px；
高度：40px；
宽度：100%；
背景颜色：绿色；
}
var banner_颜色=ţQ55550D'、35555555550D'、ţQ5555D'、ţfffb00'、3555555555555555555555555D0'，”DQQ55555550000D零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零零1d5273’、‘b6dbf2’、‘3354cc’、‘162559’、‘8f93bf’、‘2a00e6’、‘474359’、‘390080’、‘5b3973’、‘250033’、‘b539e6’、‘c499cc’、‘800071’、‘660031’、‘C4355’、‘D66’8’、‘cc002c’、‘d9a3ae’、‘660009’、‘ff808a’、‘403031’；
变量i=0，howManyTimes=banner\u colors.length；
函数f（）{
document.getElementById（'banner'）.style.backgroundColor=banner_colors[i]；
i++；
如果（i<多少次）{
设置超时（f，1000）；
}
}
document.onload=f（）；
主页内容在这里

主页内容在这里

主页内容在这里

主页内容在这里

主页内容在这里

你好，来自Flask！
使用
窗口。addEventListener（“加载”，f）
在页面加载后运行它（其中
f
是封装在函数中的
标记的内容）。

使用
窗口。addEventListener（“加载”，f）
在页面加载后运行它（其中
f
是包装在函数中的
标记的内容）.

工作正常…因为您正在为onload事件处理程序提供函数调用，而不是函数引用。使用
document.onload=f
@SpencerWieczorek可以停止错误，但JS也不工作。@user193661使用
window.onload=f
，它更受支持。这一个可以工作正常…因为您是givi正在为onload事件处理程序调用函数，而不是函数引用。请使用
document.onload=f
@SpencerWieczorek停止错误，但JS也不起作用。@user193661使用
window.onload=f
，它更受支持。该函数有效。window.addEventListener（“加载”，f）works.document.onload不工作窗口。addEventListener（“加载”，f）工作。document.onload不工作