gpt4 book ai didi

javascript - page.onload 函数未运行

转载 作者:太空宇宙 更新时间:2023-11-04 16:27:46 25 4
gpt4 key购买 nike

我刚开始制作我的第一个网站,这是我遇到的第一个真实问题。我正在尝试制作“登录”和“注册”按钮,如果用户已登录,它们会自动更改其文本。为此,我正在使用 Javascript 读取 localStorage 用户名值,检查它是否等于 null,然后基于此设置两个按钮的 .innerHTML。问题?我的 Javascript 无法运行。这是 HTML/Javascript 代码:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Phyre-Home</title>
<link href="Phyre-Home.css" rel="stylesheet">
<script language="javascript">
page.onload function{
var profile = document.getElementById("Profile");
var signout = document.getElementById("SignUpOut");
var username = localStorage.getItem('phyreUsername');
if(username == null) {
profile.innerHTML = "Sign in";
signout.innerHTML = "Sign up";
}else{
profile.innerHTML = username;
signout.innerHTML = "Sign out";
}
}
</script>
</head>
<body>
<header>
<img src="PhyreSiteHeader.bmp" alt="Phyre">
<button id="SignUpOut"></button>
<button id="Profile"></button>
<h1 style="display:none">Fire</h1>
<script language="javascript">

</script>
</header>
<nav>
<ul>
<li><b>Home</b></li>
<li><a href="www.phyregaming.com/profile">Profile</a></li>
<li><a href="www.phyregaming.com/games">Games</a></li>
<li><a href="www.phyregaming.com/chat">Chat</a></li>
<li><a href="www.phyregaming.com/videos">Videos</a></li>
</ul>
</nav>
<aside>
<h1><b>Page Nav</b><br></h1>
<p><i>This page does not have its own, separate navigation section. Sorry.</i></p>
<h1><b>Ads</b><br></h1>

</aside>
<article>

</article>
</body>
</html>

...这是 CSS,以防万一:

article, aside, figure, figcaption, footer, header, main, nav, section, summary {
display:block;
}
header:img{
max-width:90%;
}
body{
background-color:rgb(75, 75, 75);
margin:0px;
font-family:times new roman, serif;
}
header{
width:100%;
float:top;
}
#SignUpOut{
position:absolute;
top:0%;
right:0%;
}
#Profile{
position:absolute;
top:0%;
right:7.5em;
}
h1{
text-align:center;
font-family:AR BLANCA, times new roman, serif;
}
ul{
list-style-type:none;
margin:0;
padding:0;
}
li{
float:left;
width:20%;
font-size:large;
text-align:center;
border-style:solid;
border-color:rgb(187, 15, 23);
box-sizing:border-box;
background-color:rgb(237, 28, 36);
border-width:2px;
margin-bottom:0.5%;
}
aside{
float:left;
width:20%;
border-style:solid;
border-color:rgb(187, 15, 23);
box-sizing:border-box;
background-color:rgb(237, 28, 36);
border-width:3.5px;
padding:0.5%;
margin-right:0.5%;
}
article{
float:right;
width:79.5%;
border-style:solid;
border-color:rgb(187, 15, 23);
box-sizing:border-box;
background-color:rgb(237, 28, 36);
border-width:3.5px;
padding:0.5%;
}

罪魁祸首是第一个 Javascript 部分。如果可以,请提供帮助,我是 HTML5、CSS3 和 Javascript 的新手。

附言我还没有域或任何东西,所以所有链接都无效。

最佳答案

据我所知,没有 page 这样的东西,你可能想要 window

window.onload = function() {...

或者只是放下 onload 处理程序并将脚本移动到底部,就在 </body> 之前

关于javascript - page.onload 函数未运行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24247010/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com