폼 속성
입력 양식(form)
정의
아이디와 패스워드를 입력하는 화면처럼,
사용자에게 무엇인가를 입력하게 하는 것을 입력 양식, 혹은 폼이라고 부름
속성
폼 태그는 <input> 태그를 기본으로 일반 텍스트, 비밀번호, 체크박스, 라디오 버튼
등의 입력 방법을 속성으로 지정 가능
form 태그 속성
type : 일반 텍스트, 패스워드 등과 같은 입력 방식을 결정
name : 사용자의 입력 내용의 구별자
size : 입력 화면에 나타나는 글 크기를 설정
value : 텍스트 입력 상자에 기본적으로 나타나는 텍스트 문장
체크박스나 라디오 버튼에서 입력값이 임시 저장되는 곳
checked : 해당 아이템이 기본값으로 설정되어 있음을 표시
체크박스는 여러개의 체크가 가능
라디오박스는 여러개의 선택사항 중 하나만 체크 가능
select /option 태그
풀다운 방식과 리스트 방식은 화면에 여러 개의 항목을 포함하는 콤보박스가 나타나고,
그 나타난 내용 중에 원하는 것을 마우스로 선택하여 입력하는 방식.
풀 다운 방식은 input태그가 아닌 select 태그와 option태그를 이용하여 구현함.
리스트 방식은 풀다운 방식에서 왼쪽 스크롤바가 나타난 형태임.
<fieldset>
<legend>레전드 태그는 네모 칸에 캡션?을 넣는것</legend>
<input type="" name="">
<input type ="submit" value="가입하기">와
<button type="submit">가입하기</button>는 같은것.
태그 요소는 DOM의 객체로 표현됨
태그 요소에 포함된 다른 요소는 개체내에 소속된 객체 형태로 표현
요소 전체가 하나의 객체
<input type = "text" ID="username" name="username"\>
type 과 id, name은 속성
"text"와 "username"은 속성값
DOM 접근 방법 예제 : id 이용
<body>
<p id ="name">홍길동</p>
<script>
document.getElementById("name").innerHTML="이순신";
</script>
</body>
홍길동에서 이순신으로 변경됨
DOM 접근 방법 예제: id, button 이용
<body>
<p id="btn">Hello</p>
<button onclick="myFunction()">실행</button>
<script type="text/Javascript">
function myFunction(){
document.getElementById("btn").innerHTML = "안녕하세요";
}
</script>
</body>
버튼을 누르면 Hello에서 안녕하세요로 바뀜