自己紹介クイズ

select boxで選択した値に基づいてobjectとして作成された答えを送信
Velogを開いて、自己紹介を書いて、ふとやりたい例がありました.

const introduction = {
	name : "FUNco",
  	 age : "a genius experience",
     job : "General Affairs",
  family : "everything",
interest : "JS fullstack"
}

以上のように、私の紹介をobjectに設定し、selectboxで選択した項目の答えを与えます.

<h1>Self introduction</h1>
<p>What do you want to know?</p>

<select id="ask" onchange="getValue()">
    <option selected>선택하세요</option>
    <option value="name">이름</option>
    <option value="age">나이</option>
    <option value="job">직업</option>
    <option value="family">가족</option>
    <option value="interest">관심</option>
</select>
<h2 class="answer"></h2>

1.構想

step.1ユーザー選択値の値を抽出します.
step.2番目のvalueを解関数の因子とする.
step.3 objectからobject.valueの形式で答えを抽出する.
step.4その後、h 2のinnerTextに答えを送信する.

2. code

const givewAnswer = (val) => {
    const answer = introduction[val];
    document.querySelector('.answer').innerText = answer;
}
const target = document.querySelector('#ask');
const getValue = () => {
    const question = target.options[target.options.selectedIndex].value;
    givewAnswer(question);
    console.log(question);
}
</script>

3. web view