动态添加DIV，为什么失败了_html/css_WEB-ITnose-html教程-PHP中文网

动态添加DIV，为什么失败了_html/css_WEB-ITnose

php中文网

发布： 2016-06-24 11:46:36

原创

1296人浏览过

用一个for循环添加了10个 DIV，可是页面不显示，哪里出错了啊

   <html>  	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">    <head>      <title>看看连</title>      <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js" type="text/javascript"></script> 	<script>			$(document).ready(function(){			var divId=0;			for(var i=0;i<10;i++){				var obj =document.createElement("div");				obj.id="myDiv"+divId;				divId++;				obj.style.background-image='url(1.jpg)';							obj.style.height="50px";				obj.style.width="50px";								document.body.appendChild(obj);          			}		});		</script>    </head>      <body>      </body>      </html>

登录后复制

度加剪辑

度加剪辑（原度咔剪辑），百度旗下AI创作工具

查看详情

回复讨论(解决方案)

页面需要重新渲染一下。

怎么重新渲染一下页面啊？

1.如果是用appendChild来做，
var grid = mini.get("datagrid");
var gridEl = grid.getEl();
div.appendChild(gridEl)

2.如果是加入的miniui的html标签，那么加入完毕，需要执行下mini.parse()，来解析下html标签

obj.style['background-image']='url(1.jpg)';

obj.style.background-image改成obj.style.backgroundImage

简单改了一下，你看看，

 <html>      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">    <head>      <title>看看连</title>      <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>     <script>        $(document).ready(function(){            var htmlappend="";            for(var i=0;i<10;i++){               htmlappend+= '<div id=myDiv'+i+' style = "backgroundImage:url(1.jpg);color:red;height:50px;width:150px;">序号:'+(i+1)+'</div> ';            }            $("body").append(htmlappend);           });    </script>    </head>      <body>      </body>      </html>

登录后复制

看4楼

最奇怪的是你在一个jquery的壳子里面写着原生dom操作