MLP) [JavaScript] form 태그 내 요소 접근 방법

<form> 태그 요소 접근 방법

1. <form>태그의name속성값. 접근할태그의name속성값.속성명
   속성명: value, type, name 등
2. <form>태그의name속성값.접근할태그의name속성값.함수명( )
   함수: focus(), select(), blur() 등

---

1. 속성명으로 접근

폼 태그 내 입력 항목 데이터를 가져와서 출력

See the Pen Untitled by 챈챈 (@naaoviji-the-animator) on CodePen.

국어 점수를 textbox에 입력하고 "성적 내기" 버튼을 클릭하면 코드가 잘 실행된다.

사용자가 입력한 국어 점수를 let kor 변수에 넣었다.

let kor = subject.kor.value;

 

 

---

2. 함수명으로 접근

.focus( ): 해당 요소에 포커스를 부여

See the Pen Untitled by 챈챈 (@naaoviji-the-animator) on CodePen.

 

국어 점수를 입력하지 않고 "성적 내기" 버튼을 클릭하면 국어 점수를 입력하라는 알람이 뜨면서 국어 점수 박스에 포커스가 간다.

  if (!kor){
    alert("국어 점수를 입력하세요");
    subject.kor.focus();
    return;
  }

※ !kor : kor 변수에 값이 입력되지 않은 경우 true가 되어 { } 안의 코드가 실행된다.