动态创建html文档
[英]creating html document dynamically
问题描述
<!DOCTYPE>
<html>
<script>
var btn = document.createElement("BUTTON");
var txt = document.createTextNode("Text");
btn.appendChild(txt);
document.body.appendChild(btn);
</script>
</html>
我刚刚开始学习HTML和JavaScript。
我期望上面的代码输出一个带有单词“ text”的按钮。 不幸的是，输出为空白。 有人可以向我解释为什么此代码不起作用吗？
3 个解决方案
解决方案1
3 已采纳 2015-04-17 02:24:23
您的脚本不会执行任何操作，因为它位于头部，因此您的脚本在运行之前需要使用window.onload函数
<!DOCTYPE>
<html>
<script>
window.onload = function(){
var btn = document.createElement("BUTTON");
var txt = document.createTextNode("Text");
btn.appendChild(txt);
document.body.appendChild(btn);
}
</script>
</html>
解决方案2
1 2015-04-17 02:22:18
jsve已经关闭。 您需要确保在加载主体时加载了代码。 这是通过调用主体的onload函数来完成的，如下所示：
<!doctype html>
<html>
<head>
<script>
function init(){
var btn = document.createElement("BUTTON");
var txt = document.createTextNode("Text");
btn.appendChild(txt);
document.body.appendChild(btn);
}
</script>
</head>
<body onload="init()"></body>
</html>
解决方案3
0 2015-04-17 02:19:44
您需要在加载主体后运行该代码：
<!doctype html>
<html>
<head>
<script>
function addBtn() {
var btn = document.createElement("button");
var txt = document.createTextNode("Text");
btn.appendChild(txt);
document.body.appendChild(btn);
}
</script>
</head>
<body onload="addBtn()"></body>
</html>
还有一些评论：
如上所示，您还需要将
DOCTYPE更新为<!doctype html>。将
<script>标记包装在<script><head>标记内。无需大写
button。
动态创建HTML
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.