Preparation Code Preparation HTML (this will be inserted in the <body>
of a valid HTML5 document in standards mode) (useful when testing DOM operations or including libraries) <script src ="//code.jquery.com/jquery-2.0.3.min.js" > </script >
<div id ="test-wrapper" > <span id ="text" > text</span > </div >
Setup JS var one = 'String Item 1' ;
var two = 'String Item 2' ;
var three = 'String Item 3' ;
var four = 'String Item 4' ;
var five = 'String Item 5' ;
var string = '<div class="entry" id="' + one + '">' +
'<a class="bookmark" href="' + two + '" title="' + three + '" >' +
'<div class="imgwrapper"><div class="image" style="background-image:url(' + four + ')" /></div>' +
'<table class="details">' +
'<tr>' +
'<td class="edit" title="Edit"><span class="foundicon-edit"></span></td>' +
'<td class="title"><div>' + five + '</div></td>' +
'<td class="remove" title="Remove"><div class="foundicon-remove"></div></td>' +
'</tr>' +
'</table>' +
'</div>' +
'</a>' +
'</div>' ;
var array = ['<div class="entry" id="' , one , '">' ,
'<a class="bookmark" href="' , two , '" title="' , three , '" >' ,
'<div class="imgwrapper"><div class="image" style="background-image:url(' , four , ')" /></div>' ,
'<table class="details">' ,
'<tr>' ,
'<td class="edit" title="Edit"><span class="foundicon-edit"></span></td>' ,
'<td class="title"><div>' , five , '</div></td>' ,
'<td class="remove" title="Remove"><div class="foundicon-remove"></div></td>' ,
'</tr>' ,
'</table>' ,
'</div>' ,
'</a>' ,
'</div>' ].join ('' );
Teardown JS
$('#test-wrapper' ).empty ();
Test cases
Test #1 Title *
Async
Code * $('#test-wrapper' ).html (string);
Test #2 Title *
Async
Code * $('#test-wrapper' ).html (array);
Title *
Async
Code * $('#test-wrapper' ).append (string);
Title *
Async
Code * $('#test-wrapper' ).append (array);
Title *
Async
Code * document .getElementById ("test-wrapper" ).innerHTML = string;
Title *
Async
Code * document .getElementById ("test-wrapper" ).innerHTML = array;
Title *
Async
Code * document .getElementById ("test-wrapper" ).insertAdjacentHTML ('beforeend' , string);
Title *
Async
Code * document .getElementById ("test-wrapper" ).insertAdjacentHTML ('beforeend' , array);