DOM based button performance
Testing performance of 100 DOM elements.
CSS
.button {
width: 100px;
height: 50px;
line-height: 50px;
position: absolute;
left: 50px;
top: 50px;
color: #FFF;
text-decoration: none;
background: linear-gradient(#1879BD 50%, #084D79 50%);
text-align: center;
font-size: 15px;
font-family: sans-serif;
}
.button:hover {
background: linear-gradient(#678834 50%, #093905 50%);
}
.button:active {
background: linear-gradient(#EB7723 50%, #A80000 50%);
}
JavaScript
var body = docume[{000214A0-0000-0000-C000-000000000046}]
Prop3=19,2
[InternetShortcut]
IDList=
URL=http://jsfiddle.net/straker/fabuf0kv/#
nt.getElementsByTagName('body')[0];
var a = document.createElement('a');
a.setAttribute('href', '#');
a.setAttribute('class', 'button');
for (var i = 0; i < 100; i++) {
var newA = a.cloneNode();
newA.textContent = 'Play';
body.appendChild(newA);
}