为什么我的Javascript内容在网页中不可见

我是javascript新手。我试着用html、css和JS制作一些问答游戏。 在测验中，我要计时1分钟。我为计时器和模板分别编写了代码。计时器工作正常

但当我合并这两个代码时，计时器不可见。虽然在完成1分钟后，它会发出信息“时间到了”。我使用了定位属性并尝试了不同的位置，但仍然不可见

分数
{
位置：绝对位置；
左：900；
}
#全部
{
背景色：黑色；
颜色：白色；
宽度：80%；
身高：70%；
位置：相对位置；
排名前45名；
左：95；
边框：4倍纯黑；
}
.optns
{
宽度：40%；
身高：5%
}
#问题:
{
颜色：黑色；
背景色：#F2F2；
宽度：99%；
身高：20%；
位置：绝对位置；
排名前35名；
左：5；
}
.optn1
{
位置：绝对位置；
排名：190；
左：120；
}
.optn2
{
位置：绝对位置；
排名：230；
左：120；
}
.optn3
{
位置：绝对位置；
排名：270；
左：120；
}
.optn4
{
位置：绝对位置；
排名：310；
左：120；
}
上一篇
{
位置：绝对位置；
下行：80px；
左：200px；
}
下一个
{
位置：绝对位置；
下行：80px；
右：200px；
}
#计时器
{
位置：绝对位置；
顶部：1000px；
背景颜色：粉红色；
颜色：蓝色；
字体系列：草书；
z指数：9999；
}
这里是计时器
var fixed=新日期（）；
var fixedsecond=fixed.getSeconds（）；
var fixedmin=fixed.getMinutes（）；
函数changetime（）
{
var current=新日期（）；
var currentsecond=current.getSeconds（）；
var currentmin=current.getMinutes（）；
var m=当前最小固定最小值；
var s=（当前秒固定秒）；
如果（s=1）
{
净间隔（t）；
提示（“时间到了”）；
}
document.getElementById（“计时器”）.innerHTML=“+m+”：“+s
+"";
}
var t=设置间隔（更改时间，1000）；
分数
问题在这里
选择1
选择2
选择3
选择4
以前的
下一个

您可以调用

document.getElementById（“计时器”）

，但HTML中还不存在此元素。您需要在HTML中包含此元素，或者通过JavaScript在文档中创建它

试着这样做：

<div id="timer">TIMER HERE</center>

---

另外-您不应该使用

，因为它已被弃用。

您应该使用任何浏览器（Safari、Chrome等）直接从Web开发人员控制台看到javascript错误。 此代码在此行失败

document.getElementById("timer").innerHTML

没有id为“timer”的元素。

您在HTML中使用“whole”作为id，但在javascript中调用“timer”id

更新脚本中的id，如下所示：

document.getElementById("timer").innerHTML

与

1） 改变

3） 您的CSS被窃听，请更改：

#timer {
  position: absolute;
  top: 1000px;
  background-color: pink;
  color: blue;
  font-family: cursive;
  z-index: 9999;
}

因此：

#timer
{
text-align: center;
background-color:pink;
color:fff;
font-family:cursive;
}

---

现在您可以看到您的计时器…

中间的标记，带有“document.getElementById”的id=timer。您正在引用

null

（请参阅控制台输出）。注意，已弃用。除此之外，您不需要在

innerHtml

中再次包含外部元素。这就是为什么它被称为：

document.getElementById（'timer'）.innerHTML='+m+'：'+s+'
<center id="timer">TIMER HERE</center>

<div id="timer">TIMER HERE</div>

document.getElementById("timer").innerHTML = "<center id=timer><h1>" + m + ":" + s

document.getElementById("timer").innerHTML=m+":"+s;

#timer {
  position: absolute;
  top: 1000px;
  background-color: pink;
  color: blue;
  font-family: cursive;
  z-index: 9999;
}

#timer
{
text-align: center;
background-color:pink;
color:fff;
font-family:cursive;
}