select 박스의 옵션 접근 방법 제일 마지막 내용으로 넣으려고 했는데 저번 수업 시간에 썼던 게 생각이 났다.
한번 써보니까 자주 쓸 것 같은 기능이라 따로 빼면 좋을 것 같아서 따로 정리!

---

1. 셀렉트 박스 선택 값 받아오기

• 셀렉트 박스 항목 변경 감지 이벤트 : onchange()

• 함수 호출 시 선택된 항목의 value 속성값을 전달하기 위해 this.value를 파라미터로 전달

⭐ Ex

<form name="fr">
  <select name="fruits" onchange="func(this.value)">
    <option value="">선택하세요</option>
    <option value="Apple">사과</option>
    <option value="Strawberry">딸기</option>
    <option value="Banana">바나나</option>
  </select>
  <input type="text" name="selectFruit">
</form>

---

2. 텍스트 박스에 선택항목 표시

• 텍스트 박스에 value 속성에 셀렉트 박스 value 값 대입

  -> 텍스트 박스 name 속성 설정 필수!

  -> 셀렉트 박스 value 속성 설정 필수!

⭐ Ex

function fuc(fruit) {
  document.fr.selectFruit.value  = fruit;
  // 파라미터로 전달받은 셀렉트박스 속성값을 
  // 텍스트 박스 속성값에 전달함
}

📌 출력