JavaScript 如何将HTML代码追加到一个div中

要使用JavaScript将HTML代码追加到一个div中，我们首先需要选择div元素。我们可以通过使用document.getElementById()方法并传入div元素的id来做到这一点。接下来，我们使用div元素的innerHTML属性，将其设置为我们想要追加的HTML代码，前面加上+=操作符。

方法

使用 JavaScript 向 div 附加 HTML 代码的一种方法是使用其 id 选择该 div。

然后使用innerHTML属性来添加所需的HTML代码。比如说

var div = document.getElementById('myDiv');
div.innerHTML += '<p>This is some new HTML code</p>';

解释一下

在这个例子中，我们将使用JavaScript将HTML代码附加到一个div中。

首先，我们将创建一个div元素–

<div id="container"></div>

接下来，我们将创建一个函数，将HTML代码追加到div元素上：

function appendHtml() {
   var div = document.getElementById('container');
   div.innerHTML += '<p>This is some HTML code</p>';
}

最后，我们将在页面加载时调用该函数 —

window.onload = function() {
   appendHtml();
}

例子

<!DOCTYPE html>
<html>
<head>
   <title>Append HTML Code</title>
</head>
   <body>
      <div id='container'></div>
      <script>    
         function appendHtml() {
            var div = document.getElementById('container');
            div.innerHTML += '<p style="color:black">This is some HTML code</p>';
         }       
         window.onload = appendHtml;
      </script>
   </body>
</html>