Talvez hago mal el Test... pero me salta que es mas rápido crear 1000 elementos con DOM que innerHTML....
pueden probarlo?
Código PHP:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>asdasdasdasd</title>
<script type="text/javascript">
var samp_bench=function()
{
var g=document.getElementById("bla");
var t=document.getElementById("target");
t.innerHTML="";
var startTime=new Date().getTime();
for(i=0;i<1000;i++)
{
var a = document.createElement("span");
t.appendChild(a);
var endTime=new Date().getTime();
}
g.innerHTML = "Con DOM =>"+(endTime-startTime);
}
var samp_bench2=function()
{
var g=document.getElementById("bla");
var t=document.getElementById("target");
var startTime=new Date().getTime();
t.innerHTML="";
for(i=0;i<1000;i++)
{
t.innerHTML+="<span></span>"
var endTime=new Date().getTime();
}
g.innerHTML = "con InnerHTML=>"+(endTime-startTime);
}
</script>
<style type=text/css>
.pan{
background-color:#FFFFFF;
border:1px dashed red;
width:200px;
height:50px;
color:white;
font:normal 0.8em Tahoma,MiscFixed;
text-align:center;
vertical-align:bottom;
}
</style>
<link rel="stylesheet" type="text/css" href="style.panel.css" />
</head>
<body>
<input type="button" value="1000 elementos con document.createElement!!!!" onclick="samp_bench();">
<input type="button" value="1000 elementos con innerHTML !!!" onclick="samp_bench2();">
<div id="bla"></div>
<div id="target"></div>
</body>
</html>
connection closed.
