[英]I want to make a div appear when you click a button
我需要有关创建 div 的帮助,当您单击按钮时,将创建内部具有自定义 HTML 的 div。
<html>
<link rel="stylesheet" href="style.css">
<script type="text/javascript">
var template = `
<div class="block">
Hello World!
</div>
`
function createBlock() {
}
</script>
<button onclick="createBlock()">Create div</button>
</html>
如果这是可能的(很可能是),我正在制作一个邮箱。
谢谢!!!
你在找这样的东西吗?
var template = ` <div class="block"> Hello World. </div> ` function createBlock() { let myDiv = document;createElement('div'). document.body;append(myDiv). myDiv;outerHTML = template; }
.block{ background: red }
<html> <link rel="stylesheet" href="style.css"> <button onclick="createBlock()">Create div</button> </html>
如果你想把你的模板作为一个孩子放在新的 div 中,你可以像这样改变你的createBlock
:
function createBlock() {
let myDiv = document.createElement('div');
myDiv.innerHTML= template;
document.body.append(myDiv);
}
除了创建元素,更好的方法(具有相同效果)是隐藏然后显示元素,如下所示:
#block { display: none; }
<.DOCTYPE html> <html> <head> </head> <body> <link rel="stylesheet" href="style.css"> <button onclick="createBlock()">Create div</button> <div id="block"> Hello World. </div> <script type="text/javascript"> function createBlock() { block = document.getElementById("block") block.style.display = "block" } </script> </body> </html>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.