Javascript帮助动态创建html元素并将元素填充到DOM中_Javascript_Jquery_Html

Javascript帮助动态创建html元素并将元素填充到DOM中

javascript jquery html

Javascript帮助动态创建html元素并将元素填充到DOM中,javascript,jquery,html,Javascript,Jquery,Html,因此，在这里的脚本标记中，我有一个数组myArr，它被打印到html中的p标记中： <html> <body> <h1>Header 1</h1> <div> <p id="test"></p> </div> </body> </html> <script> var myArr = ["abc", 123, "test"]; document.getE

因此，在这里的脚本标记中，我有一个数组myArr，它被打印到html中的p标记中：

<html>
  <body>
<h1>Header 1</h1>
<div>
  <p id="test"></p>
</div>
</body>
 </html> 
<script> 
var myArr = ["abc", 123, "test"];
document.getElementById('test').innerHTML = myArr; 
</script>


标题1

var myArr=[“abc”，123，“测试”]；
document.getElementById（'test'）。innerHTML=myArr；

这一切都是好的。因此，我有几个问题要问，因为我对javascript还很陌生

我知道如何遍历数组并打印出脚本标记中的每个元素。但是我怎样才能将它显示到html中呢？是否有一种方法可以动态创建p标记，将数组中的元素作为内容

我是否能够轻松地将样式添加到动态创建的p标记中

这种事情可以使用jquery之类的工具来完成吗？或者另一个流行的简单javascript库？不幸的是，我将无法运行一个完整的javascript框架。我只能运行一个基本的库

我尝试在这里尝试：

var my_arr=[“测试”，“abc”，123]；
var arr_length=我的arr.length；
对于（i=0；i


我的第一个网页
我的第一段
您只需对阵列执行forEach
。在回调内部，创建一个p
，将其附加到所需的容器中，并将其textContent
设置为数组元素。不需要框架/库：

const test=document.getElementById（'test'）；
const my_arr=[“测试”，“abc”，123]；
我的到达日期（（项目）=>{
test.appendChild（document.createElement（'p'））
.textContent=项目；
});
我的第一个网页
我的第一段
您只需对阵列执行forEach
。在回调内部，创建一个p
，将其附加到所需的容器中，并将其textContent
设置为数组元素。不需要框架/库：

const test=document.getElementById（'test'）；
const my_arr=[“测试”，“abc”，123]；
我的到达日期（（项目）=>{
test.appendChild（document.createElement（'p'））
.textContent=项目；
});
我的第一个网页
我的第一段
请将代码包括在问题中。所有相关细节（包括尝试）都需要在问题本身中。请在问题中包含代码。所有相关细节（包括尝试）都需要在问题本身中。