使用标记的javascript变量值

时间:2017-07-25 19:41:56

标签: javascript html

function changeFunc9() {
    var selectBox9 = document.getElementById("Schallamach");
    selectedValue9 =selectBox9.options[selectBox9.selectedIndex].value;
    console.log(selectedValue9);
 }
var values = [selectedValue1, selectedValue2, selectedValue3, 
selectedValue4, selectedValue5, selectedValue6, selectedValue7, 
selectedValue8, selectedValue9];

我没有包含我的整个代码,因为它对于每个selectedValue#变量都是一致的。 selectedValues来自html中的select标签,用户从不同选项列表中选择。我的功能只是将他们的选择存储在变量中并将其记录到控制台,这样我就可以确保它正常工作。我现在要做的就是使用这些变量并在表格中的td标签中显示变量的值。我在完成这项任务时遇到了困难。 selectedValues位于数组中,因此它们是全局的。如果有人能给我一些关于如何将这些变量分配给td的指导,那将是非常棒的并且非常感激。 我宁愿不使用jQuery。 另外,我使用单独的js文件并将其链接到html。我不知道这是否有所作为。

2 个答案:

答案 0 :(得分:1)

function valuesToTd(values) {
  return values.map((value) => {
    const td = document.createElement("td")
    td.textContent = value
    return td
  })
}

function addToTable(values, table) {
  const tds = valuesToTd(values)
  const tr = document.createElement("tr")
  tds.forEach(tr.appendChild.bind(tr))
  table.appendChild(tr)
}

const selectedValues = ["one", "two", "three"]
const table = document.querySelector("table")
addToTable(selectedValues, table)
<table></table>

答案 1 :(得分:0)

根据我的理解,您需要连续显示“values”数组中的数据。如果是这种情况,请参考以下代码。

HTML - 定义表格

<table border="1"><tr id="dataRow"></tr></table>

JS

<script>
var values = [selectedValue1, selectedValue2, selectedValue3, 
selectedValue4, selectedValue5, selectedValue6, selectedValue7, 
selectedValue8, selectedValue9];
for(var i=0;i<values.length;i++){
    document.getElementById("dataRow").innerHTML+="<td>"+values[i]+"</td>"
}
</script>