OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <body style="font-family: ahem; -webkit-font-smoothing: none;"> | 3 <body style="font-family: ahem; -webkit-font-smoothing: none;"> |
4 <style> | 4 <style> |
5 div.table { display: table; } | 5 div.table { display: table; } |
6 div.section { display: table-row-group; } | 6 div.section { display: table-row-group; } |
7 div.cell { display: table-cell; width: 50px; height: 50px; background-color:
blue; } | 7 div.cell { display: table-cell; width: 50px; height: 50px; background-color:
blue; } |
8 div.row { display: table-row; } | 8 div.row { display: table-row; } |
| 9 div.test { background-color: green; width: 50px; height: 50px; } |
9 </style> | 10 </style> |
10 | 11 |
11 <div class="table" id="table-1"> | 12 <div class="table" id="table-1"> |
12 <div class="section" id="tbody-1"> | 13 <div class="section" id="tbody-1"> |
13 <div class="row" id="row-1"> | 14 <div class="row" id="row-1"> |
14 <div class="cell" id="cell-1"></div> | 15 <div class="cell" id="cell-1"></div> |
15 <div class="cell" id="cell-2"></div> | 16 <div class="cell" id="cell-2"></div> |
16 </div> | 17 </div> |
17 </div> | 18 </div> |
18 </div> | 19 </div> |
19 | 20 |
20 <script> | 21 <script> |
21 function createSpan() | 22 function createDiv() |
22 { | 23 { |
23 var spanElement = document.createElement("span"); | 24 var divElement = document.createElement("div"); |
24 spanElement.appendChild(document.createTextNode("Some text.")); | 25 divElement.setAttribute("class", "test"); |
25 return spanElement; | 26 return divElement; |
26 } | 27 } |
27 | 28 |
28 function insertSpan(tableID, beforeID) | 29 function insertDiv(tableID, beforeID) |
29 { | 30 { |
30 var tableRow = document.getElementById(tableID); | 31 var tableRow = document.getElementById(tableID); |
31 var before = document.getElementById(beforeID); | 32 var before = document.getElementById(beforeID); |
32 tableRow.insertBefore(createSpan(), before); | 33 tableRow.insertBefore(createDiv(), before); |
33 } | 34 } |
34 | 35 |
35 document.body.offsetTop; | 36 document.body.offsetTop; |
36 | 37 |
37 insertSpan("row-1", "cell-2"); | 38 insertDiv("row-1", "cell-2"); |
38 </script> | 39 </script> |
39 </body> | 40 </body> |
40 </html> | 41 </html> |
OLD | NEW |