| 12345678910111213141516171819202122232425262728 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Document</title>
- </head>
- <body>
- <div class="box"></div>
- <button>按钮</button>
- <script>
- // 获取元素
- var btn = document.querySelector("button");
- var box = document.querySelector(".box");
- btn.onclick = function(){
- // box.innerHTML = "<h1>hello world</h1>"
- // 创建DOM元素
- var newDom = document.createElement("h1");
- // 控制元素与之前方式相同
- newDom.innerText = "hello world";
- newDom.style.color = "red";
- // 将新创建的元素添加到指定的地方
- box.appendChild(newDom);
- }
- </script>
- </body>
- </html>
|
