​​タグのjavascript変数値を使用

Question

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内の選択タグから来ています。私の機能は単に変数に選択肢を格納してコンソールに記録するだけで、正しく動作することを確認できます。私が今やりたいのは、これらの変数を使用して、テーブルのtdタグに変数の値を表示することだけです。私はこの仕事に困っています。 selectedValuesは配列内にあり、グローバルになります。誰かが私にこれらの変数をtdに割り当てる方法についていくつかの指針を与えることができれば、それはすばらしいことであり、非常に高く評価されます。 jQueryを使用しないことをお勧めします。 また、別のjsファイルを使用してhtmlにリンクしています。それが違いを生むかどうかはわかりません。

Answer 1

私が理解したところでは、 "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> 

Answer 2

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>