Javascript创建分区

我想创建一个页面，使用JavaScript创建5个随机DIVS。出于某种原因，只有在我的页面上有<!doctype html>标签之前有任何内容时才起作用，这对我来说毫无意义。任何有关我在做什么错误的见解？Javascript创建分区

<!doctype html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>Untitled Document</title> 
</head> 

<body> 



<div id = "boxHouse"> 

</div> 

<script> 
var divNum = 1; 
for (x = 0; x<5; x++){ 

var boxDiv = document.getElementById("boxHouse"); 

var newElm = document.createElement("div"); 
newElm.id = divNum; 
newElm.style.width = Math.floor((Math.random()*100)+2); 
newElm.style.height = Math.floor((Math.random()*100)+2); 
newElm.style.border = "thin solid black"; 
newElm.style.backgroundColor = "#FF0000"; 

divNum++ 

boxDiv.appendChild(newElm); 
    } 


</script> 
</body> 
</html>

来源

2014-03-06 user2980869

你对'标签前的任何内容'有何意义？ –

对不起，它迷路了，它只显示divs correclty，如果我在doctype标签 – user2980869

如果加上单位的宽度和高度，你的代码将工作：

newElm.style.width = Math.floor((Math.random()*100)+2) + "px"; 
newElm.style.height = Math.floor((Math.random()*100)+2) + "px";

这是需要的原因是没有单位的CSS大小就会被抛弃，所以的div是空的，因此您只能将其边框堆叠为页面顶部的细黑条。

编辑：它的工作原理，如果你在doctype之前添加的东西是，然后浏览器进入怪癖模式（而不是标准兼容模式与doctype），它是更多的非标准事物接受像破碎的CSS单位。

来源

2014-03-06 03:46:39

是之前添加任何字符。这正是它的错误。非常感谢。我再也不会犯这个错误 – user2980869

我刚刚在帖子中看到了你的修改，并且在其中添加了更多的细节。在doctype之前添加内容会导致doctype无法计数;它关闭标准模式，浏览器更接受非标准代码怪癖。 –

Javascript创建分区

回答

相关问题