innerTextとinnerHTMLの違い

• • 書いてみれば一目瞭然。

<script language="JavaScript">
<!--

function t_innerText () {
    var table = document.getElementById('tbl_i1');
    for( i = 1; i < table.rows.length; i++ ) {
       table.rows[i].cells[0].innerText = "<!-- test -->";
    }
}
function t_innerHTML () {
    var table = document.getElementById('tbl_i1');
    for( i = 1; i < table.rows.length; i++ ) {
       table.rows[i].cells[0].innerHTML = "<!-- test -->";
    }
}

-->
</script>

<input onclick="t_innerText()" type="button" value="innerText">
<input onclick="t_innerHTML()" type="button" value="innerHTML">

<style type="text/css">
table.tbl_c1 {
	border: 1px #E3E3E3 solid;
	border-collapse: collapse;
	border-spacing: 0;
}
table.tbl_c1 thead td {
	border-bottom: 3px double #E3E3E3;
	background-color: #F5F5F5;
}
table.tbl_c1 td {
	border: 1px #E3E3E3 solid;
	padding: 3px;
}
</style>

<table id="tbl_i1" class="tbl_c1">
   <thead>
      <tr><td>key</td><td>val</td></tr>
   </thead>
   <tfoot>
   </tfoot>
   <tbody>
      <tr><td>key1</td><td>val1</td></tr>
      <tr><td>key2</td><td>val2</td></tr>
      <tr><td>key3</td><td>val3</td></tr>
   </tbody>
</table>