Skip to content

Instantly share code, notes, and snippets.

@boyofgreen
Created April 4, 2012 03:14
Show Gist options
  • Select an option

  • Save boyofgreen/2297467 to your computer and use it in GitHub Desktop.

Select an option

Save boyofgreen/2297467 to your computer and use it in GitHub Desktop.
HTML5 Hacks 2.8
<table width="100%" border="1">
<tr>
<th>Title</th>
<th>Price</th>
</tr>
<tr id="323">
<td>Google Hacks</td>
<td>FREE</td>
</tr>
<tr id="324">
<td>Ajax Hacks</td>
<td>FREE</td>
</tr>
<tr id="325">
<td>HTML5 Hacks</td>
<td>FREE</td>
</tr>
</table>
//javascript access to value
var nodeValue = document.getElementById(‘myNode’).getAttribute(‘data-myvalue’) //nodeValue = ‘true’
//javascript access to value
var nodeValue = document.getElementById(‘myNode’).dataset.myvalue //nodeValue = ‘true’
<table width="100%" border="1">
<tr>
<th>Title</th>
<th>Price</th>
</tr>
<tr data-key="323">
<td>Google Hacks</td>
<td>FREE</td>
</tr>
<tr data-key="324">
<td>Ajax Hacks</td>
<td>FREE</td>
</tr>
<tr data-key="325">
<td>HTML5 Hacks</td>
<td>FREE</td>
</tr>
</table>
<ul id=”carInventory >
<li class=”auto” data-make=”toyta” data-bodytype=”sadan” data-year=”2005”>
Light blue Toyota Prism
</li>
</ul>
.key{ display: none
}
<table width="100%" border="1">
<tr>
<th class="key">key row</th>
<th>Title</th>
<th>Price</th>
</tr>
<tr>
<td class="key">323</td>
<td>Google Hacks</td>
<td>FREE</td>
</tr>
<tr>
<td class="key">324</td>
<td>Ajax Hacks</td>
<td>FREE</td>
</tr>
<tr>
<td class="key">325</td>
<td>HTML5 Hacks</td>
<td>FREE</td>
</tr>
</table>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment