JS输出HTML到网页方法

在JavaScript中，可利用元素的innerHTML属性插入HTML内容。接下来通过实例演示如何将HTML代码动态输出到页面上。

1、 创建一个名为test.html的文件，通过它来演示如何使用JavaScript将内容输出到网页中。

2、 在test.html中，利用div标签创建用于展示HTML内容的区域，并将该div的id设为mydiv，以便后续通过此id获取对应的元素对象。

3、 在test.html中，通过button标签创建按钮，并为其添加onclick点击事件，当用户点击按钮时，将触发并执行名为myfun()的函数。

4、 在 test.html 文件的 js 标签中定义 myfun() 函数，函数内部声明一个 html 变量，用来存储 HTML 内容。

5、 在myfun函数中，利用for循环将多个p标签拼接成一段完整的HTML代码。

6、 在myfun()函数中，通过getElementById方法根据id获取div元素对象，并将上一步生成的HTML内容赋值给该对象的innerHTML属性，最终将内容动态插入网页中的指定div区域，实现HTML内容的页面输出与显示。

7、 用浏览器打开test.html，点击按钮即可查看效果。