select에 옵션 추가하기
중요도: 5
아래에 <select>가 있습니다.
<select id="genres">
<option value="rock">Rock</option>
<option value="blues" selected>Blues</option>
</select>자바스크립트를 사용하여 아래 항목을 수행하는 코드를 작성해봅시다.
- 선택한 옵션의 값과 텍스트를 표시하세요.
<option value="classic">Classic</option>라는 옵션을 추가하세요.- 추가한 옵션을 선택하세요.
모든 항목을 올바르게 수행했다면 얼럿창에 blues가 출력됩니다.
단계별 해답입니다.
<select id="genres">
<option value="rock">Rock</option>
<option value="blues" selected>Blues</option>
</select>
<script>
// 1)
let selectedOption = genres.options[genres.selectedIndex];
alert( selectedOption.value );
// 2)
let newOption = new Option("Classic", "classic");
genres.append(newOption);
// 3)
newOption.selected = true;
</script>