我已经使用 HTML 和 Javascript 创建了一个倒计时器(几乎)。我使用 Javascript 创建文本输入和按钮(用于启动计时器)。
但是，当我运行该页面时，输出只是两个文本文本输入框，我一生都无法弄清楚。我在不同的浏览器中尝试过该页面，结果相同。作为测试，我还尝试将按钮设为第一个元素，并且它仍然显示为文本输入。
我使用了一个调试器，当它显示 HTML(由 javascript 创建)时，它显示两个没有任何结束标记的项目。我不确定调试器是否显示创建的元素，或者当我使用 Javascript 创建输入元素时，结束标记是否实际上丢失。
我已附加:我的 HTML 页面、与创建元素相关的 Javascript 代码片段以及调试器中显示的 HTML 输出的相关片段。
感谢任何帮助，因为我不知所措。
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript - CountDown</title>
<style type="text/css">
body {
font-family: sans-serif;
color: #333;
}
#container {
width: 400px;
margin: auto;
}
</style>
</head>
<body>
<div id="container">
<div id="inputArea">
</div>
<h1 id="time">0:00 </h1>
</div>
<script src="script.js"> </script>
</body>
</html>
Javascript:
// as soon as page is loaded
window.onload = function () {
//create input text box and give it a name of 'minutes'
var inputMinutes = document.createElement("input");
inputMinutes.setAttribute = ("id", "minutes");
inputMinutes.setAttribute = ("type", "text");
//create a button
var startButton = document.createElement("input");
startButton.setAttribute = ("type", "button");
startButton.setAttribute = ("value", "Start Countdown");
startButton.onclick = function () {
startCountdown();
};
// add to the DOM to div called inputArea
document.getElementById("inputArea").appendChild(inputMinutes);
document.getElementById("inputArea").appendChild(startButton);
};
根据调试器的 HTML 输出:
<body>
<div id="container">
<div id="inputArea">
<input>
<input>
</div>
<h1 id="time">0:00 </h1>
</div>
最佳答案
.setAttribute 是一个函数，其语法如下
element.setAttribute(名称，值)
所以你的代码应该是
//create input text box and give it a name of 'minutes'
var inputMinutes = document.createElement("input");
inputMinutes.setAttribute("id", "minutes");
inputMinutes.setAttribute("type", "text");
//create a button
var startButton = document.createElement("input");
startButton.setAttribute("type", "button");
startButton.setAttribute("value", "Start Countdown");
关于Javascript 创建的按钮不会以 HTML 形式显示，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19677223/