当我们在写jsp页面时，往往会遇到这种情况：从后台获取的数据个数不确定，此时在前端写jsp页面时也就不确定怎么设计了。这个时候就需要通过js动态创建标签：
1.创建某个标签：如下在body中创建一个p的事例；
<script> function fun(){ var framep = document.createelement(p);//创建一个标签 var bodyfa = document.getelementbyid(bodyid);//通过id号获取framep 的父类（也就是上一级的节点） bodyfa .appendchild(framep);//把创建的节点framep 添加到父类body 中； } <script> <body id="bodyid" > <!--在此添加p标签--> </body>
2.添加属性：给创建的标签添加相应的属性：
framep .setattribute(id, pid);//给创建的p设置id值； framep .classname=pclass; //给创建的p设置class； //给某个标签添加显示的值； var h = document.createelement(h1); h.innerhtml = data[i].name; var p = document.createelement(p); p.innerhtml = 要显示的值;
3.创建的标签添加事件：
a.不带参数：
framep.onmousedown = fun;//ps：函数名fun后面一定不能带括号，否则会在创建标签的时候执行函数， 而不是鼠标按下时执行；
b.有参数：
framep.onmousedown = function(){ fun(this); }
c.要调用的函数；
function fun(){ alert(鼠标按下); }
4.如果担心创建的标签没有被覆盖则可以替换：
var pflag = document.getelementbyid(pflag); var pmain = document.createelement(p); if(pflag != null){ body.replacechild(pmain, pflag);//把原来的替换掉 } pmain.setattribute(id, pflag);
相信看了本文案例你已经掌握了方法，更多精彩请关注其它相关文章！
推荐阅读：
d3.js 绘制动态进度条
ngrok+express进行本地环境微信接口调试
动态加载数据滑动总是失效怎么办
以上就是js动态创建标签以及设置属性的方法的详细内容。