如何在纯javascript中使用变量插入数组值，如元素HTML

How to insert array value like element HTML using variable in pure javascript?

本文关键字：数组 插入 HTML 元素 变量 javascript      更新时间：2023-09-26

请参考变量"TEST"，如何使其成为innerHTML而不像纯文本时加载?

<!DOCTYPE html>
<head>
<title>Sum Table Column</title>
<script>
window.onload=function() {
var TEST = "<font color='#ff0000'>Apple</font>";
  var values = new Array(3);
  values[0] = [123.45, TEST, true] ;
  values[1] = [65, "banana", false];
  values[2] = [1034.99, "cherry", false];
  var mixed = document.getElementById("mixed");
  // IE7 only supports appending rows to tbody
  var tbody = document.createElement("tbody");
  // for each outer array row
  for (var i = 0 ; i < values.length; i++) {
     var tr = document.createElement("tr");
     // for each inner array cell
     // create td then text, append
     for (var j = 0; j < values[i].length; j++) {
       var td = document.createElement("td");
       var txt = document.createTextNode(values[i][j]);
       td.appendChild(txt);
       tr.appendChild(td);
     }
     // append row to table
     // IE7 requires append row to tbody, append tbody to table
     tbody.appendChild(tr);
     mixed.appendChild(tbody);
   }
}
</script>
</head>
<body>
<table id="mixed">
<tr><th>Value One</th><th>Value two</th><th>Value three</th></tr>
</table>
</body>

请参考变量"TEST"，如何使它成为innerHTML而不像纯文本时加载?

尝试用td.innerHTML = values[i][j];代替var txt = document.createTextNode(values[i][j]); 

<!DOCTYPE html>
<head>
<title>Sum Table Column</title>
<script>
window.onload=function() {
var TEST = "<font color='#ff0000'>Apple</font>";
  var values = new Array(3);
  values[0] = [123.45, TEST, true] ;
  values[1] = [65, "banana", false];
  values[2] = [1034.99, "cherry", false];
  var mixed = document.getElementById("mixed");
  // IE7 only supports appending rows to tbody
  var tbody = document.createElement("tbody");
  // for each outer array row
  for (var i = 0 ; i < values.length; i++) {
     var tr = document.createElement("tr");
     // for each inner array cell
     // create td then text, append
     for (var j = 0; j < values[i].length; j++) {
       var td = document.createElement("td");
       td.innerHTML = values[i][j];
       tr.appendChild(td);
     }
     // append row to table
     // IE7 requires append row to tbody, append tbody to table
     tbody.appendChild(tr);
     mixed.appendChild(tbody);
   }
}
</script>
</head>
<body>
<table id="mixed">
<tr><th>Value One</th><th>Value two</th><th>Value three</th></tr>
</table>
</body>

相关文章：