자바스크립트 객체

1. 폼 객체란 무엇인가요?

폼(

)은 웹페이지의 기본 요소입니다. 양식 개체의 주요 기능은 페이지의 양식에 직접 액세스하는 것입니다. 양식 개체를 사용하면 사용자와 상호 작용할 수 있으며 서버 개입 없이 웹 페이지의 동작을 동적으로 변경할 수 있습니다. 웹 페이지 양식의 경우 일반적으로 문서 개체의 양식 배열을 사용하여 다양한 양식에 쉽게 액세스할 수 있습니다. 예를 들어, HTML 파일의 일부는 다음과 같습니다:

Forms 문서 객체의 배열 두 가지 요소가 있습니다. form[0]은 세 가지 기본 요소가 있는 첫 번째 양식에 액세스할 수 있습니다. 그리고 form[1]은 요소가 두 개만 있는 form2 양식에 해당합니다.

양식 배열을 사용하여 양식 개체에 액세스하는 것 외에도 양식 이름을 사용하여 직접 액세스할 수도 있습니다. 예를 들어, 위 예에서는 document.form1 및 document.form2를 사용하여 각각 두 양식에 액세스할 수도 있습니다.

2. 양식 객체의 메소드

양식 객체의 submit() 메소드는 양식 정보를 제출하는 데 사용됩니다. 예를 들어 페이지에서 form1이라는 양식을 제출하려면 다음 문을 사용할 수 있습니다.

document.form1.submit()

3. 양식 개체의 속성

속성 설명

Name 폼 이름

action 폼 제출 후 실행되는 프로그램

target

데이터가 어느 창에 있는지 지정 (_blank,_parent, _self,_top)에 표시되거나 어떤 프레임(프레임 이름)

인코딩이 기본적으로 text/html

메서드 "Get" 또는 "Post"

요소

배열

읽기 전용, 양식에 있는 모든 개체의 인덱스, 0,1,…

문서별로 양식에 포함된 전체 개체 수를 알 수 있습니다. .formname.elements.length

여기서 elements 속성은 배열이며, 그 요소는 페이지 양식 내의 각 컨트롤에 해당합니다. 요소 외에도 양식의 다른 여러 속성은 HTML 구문의

태그 속성에 해당합니다.

4. 폼 객체 사용 예시

다음 예시에서 폼 객체를 사용하면 효과와 코드는 다음과 같습니다.

참고: "제출" 버튼을 클릭하면 양식의 onsubmit 이벤트가 트리거됩니다. onsubmit 이벤트 핸들러가 false를 반환하면 양식 데이터가 제출되지 않습니다. 하지만 양식 개체의 submit() 메서드를 직접 사용하면 데이터가 직접 제출됩니다.

* 양식의 기본 요소

양식의 기본 컨트롤은 버튼, 라디오 버튼, 확인 버튼, 제출 버튼, 재설정 버튼 및 텍스트 상자로 구성됩니다. JavaScript에서 이러한 컨트롤에 액세스하려면 다음 두 가지 방법을 사용할 수 있습니다.

Form.Element 이름 예: document.form1.check

Form.elements[subscript] 예: document. form1.elements[2]

다음은 폼의 각 기본 컨트롤을 소개합니다.

1. 텍스트 개체

텍스트 개체는 페이지의 텍스트 입력 상자 컨트롤에 해당합니다.

accessKey 속성은 텍스트 필드에 액세스하기 위한 단축키를 설정하거나 반환합니다.

Alt + accessKey를 사용하여 지정된 단축키가 있는 요소에 포커스를 둡니다.

alt 브라우저가 텍스트 필드를 지원하지 않을 때 표시할 대체 텍스트를 설정하거나 반환합니다.

defaultValue 텍스트 필드의 기본값을 설정하거나 반환합니다.

disabled 텍스트 필드를 비활성화해야 하는지 여부를 설정하거나 반환합니다.

id는 텍스트 필드의 ID를 설정하거나 반환합니다.

maxLength는 텍스트 필드의 최대 문자 수를 설정하거나 반환합니다.

name 텍스트 필드의 이름을 설정하거나 반환합니다.

readOnly 텍스트 필드가 읽기 전용인지 여부를 설정하거나 반환합니다.

size 텍스트 필드의 크기를 설정하거나 반환합니다.

tabIndex는 텍스트 필드의 탭 키 제어 순서를 설정하거나 반환합니다.

type은 텍스트 필드의 양식 요소 유형을 반환합니다. <script> <p>function display(){ <p>var str; <p>// 使用表单名称访问表单对象的属性 <p>str="name="+document.form1.name+"\r"; <p>str=str+"action="+document.form1.action+"\r"; <p>str=str+"method="+document.form1.method+"\r"; <p>//访问表单对象的elements数组 <p>str=str+"elements:"+"\r"; <p>for(var i=0;i<document.form1.elements.length;i++){ <p>str=str+ " "+document.form1.elements[i].type <p>+"\t"+document.form1.elements[i].name <p>+"\t"+document.form1.elements[i].value+"\r"; <p>} <p>window.alert(str); <p>return false; <p>} <p>function submitform(){ <p>//使用表单数组+下标访问表单对象 <p>document.forms[0].submit(); <p>} <p></script>

value 设置或返回文本域的 value 属性的值。  

方法blur( ) 将当前焦点移到后台  

select( ) 加亮文字，选取文本域中的内容。  

focus() 在文本域上设置焦点。  

主要事件onfocus，onblur，onselect，onchange  

text对象使用示例如下：  

  

  

  

<script> </script>

document.form1.text1.value="this is a javascirpt";  

document.form1.text1.select();  

alert(document.form1.text1.value);  

document.text1.blur();  

  

2、textarea对象  

textarea对象对应于页面中的textarea输入控件。  

默认文本  

属性name textarea输入框控件名称  

value textarea输入框控件中当前的文本  

defaultvalue textarea输入框控件的默认文本  

方法blur( ) 将当前焦点移到后台  

select( ) 加亮文字  

主要事件onfocus，onblur，onselect，onchange  

3、select对象  

select对象对应于网页中的下拉列表框。  

  

选项描述  

选项描述  

…………  

  

属性disabled 设置或返回是否应禁用下拉列表  

id 设置或返回下拉列表的 id。  

length 返回下拉列表中的选项数目。  

multiple 设置或返回是否选择多个项目。  

name 设置或返回下拉列表的名称。  

options  

数组  

返回包含下拉列表中的所有选项(option对象)的一个数组。  

其中option对象包括如下属性：  

text 该选项显示的文字  

value 该选项的value值  

selected 指明该选项是否别选中  

selectedIndex 当前选中项的下标  

size 设置或返回下拉列表中的可见行数。  

方法options.add() 向下拉列表添加一个选项。  

blur() 从下拉列表移开焦点。  

focus() 在下拉列表上设置焦点。  

remove() 从下拉列表中删除一个选项。  

主要事件onfocus，onblur，onchange  

4、button对象  

button对象对应于网页中的按钮控件。  

  

属性accessKey 设置或返回访问按钮的快捷键。  

alt 设置或返回当浏览器无法显示按钮时供显示的替代文本。  

disabled 设置或返回是否禁用按钮。  

id 设置或返回按钮的 id。  

name 设置或返回按钮的名称。  

tabIndex 设置或返回按钮的 tab 键控制次序。  

value 设置或返回在按钮上显示的文本。  

方法blur() 把焦点从元素上移开。  

click() 在该按钮上模拟一次鼠标单击。  

focus() 为该按钮赋予焦点。  

主要事件onclick  

5、checkbox对象  

checkbox对象对应于网页中的复选框。  

选项说明  

属性accessKey 设置或返回访问 checkbox 的快捷键。  

alt 设置或返回不支持 checkbox 时显示的替代文本。  

checked 设置或返回 checkbox 是否应被选中。  

defaultChecked 返回 checked 属性的默认值。  

disabled 设置或返回 checkbox 是否应被禁用。  

id 设置或返回 checkbox 的 id。  

name 设置或返回 checkbox 的名称。  

tabIndex 设置或返回 checkbox 的 tab 键控制次序。  

value 设置或返回 checkbox 的 value 属性的值  

方法blur() 从 checkbox 上移开焦点  

click()은 확인란에서 마우스 클릭을 시뮬레이션합니다.

focus()는 체크박스에 포커스를 줍니다.

메인 이벤트 onclick

6. 라디오 개체

라디오 개체는 웹 페이지의 라디오 컨트롤에 해당합니다. 웹 페이지에 동일한 이름을 가진 라디오 컨트롤이 여러 개 있는 경우

라디오 개체의 배열이 형성되며, 여기서 각 라디오 컨트롤은 라디오 개체입니다.

옵션 설명

옵션 설명

…………

속성 accessKey 라디오에 접속하기 위한 단축키를 설정하거나 반환합니다. 버튼.

alt 라디오 버튼이 지원되지 않을 때 표시되는 대체 텍스트를 설정하거나 반환합니다.

선택됨 라디오 버튼의 상태를 설정하거나 반환합니다.

defaultChecked 라디오 버튼의 기본 상태를 반환합니다.

disabled 라디오 버튼의 비활성화 여부를 설정하거나 반환합니다.

id는 라디오 버튼의 ID를 설정하거나 반환합니다.

name 라디오 버튼의 이름을 설정하거나 반환합니다.

tabIndex는 라디오 버튼의 탭 키 제어 순서를 설정하거나 반환합니다.

value는 라디오 버튼의 value 속성 값을 설정하거나 반환합니다.

blur() 메서드는 라디오 버튼에서 포커스를 제거합니다.

click()은 라디오 버튼에 대한 마우스 클릭을 시뮬레이션합니다.

focus()는 라디오 버튼에 포커스를 줍니다.

메인 이벤트 onclick

7. 숨은 개체

숨겨진 개체는 웹 페이지의 숨겨진 도메인에 해당합니다.

속성 Alt는 숨겨진 입력 필드가 지원되지 않을 때 표시되는 대체 텍스트를 설정하거나 반환합니다.

id는 숨겨진 도메인의 ID를 설정하거나 반환합니다.

name 숨겨진 필드의 이름을 설정하거나 반환합니다.

value는 숨겨진 필드의 value 속성 값을 설정하거나 반환합니다.

8. 제출 개체

제출 개체는 웹페이지의 제출 버튼에 해당합니다.

accessKey 속성은 제출 버튼에 액세스하기 위한 단축키를 설정하거나 반환합니다.

alt 브라우저가 제출 버튼을 지원하지 않을 때 표시할 대체 텍스트를 설정하거나 반환합니다.

disabled 제출 버튼을 비활성화할지 여부를 설정하거나 반환합니다.

id는 제출 버튼의 ID를 설정하거나 반환합니다.

name 제출 버튼의 이름을 설정하거나 반환합니다.

tabIndex는 제출 버튼의 탭 키 제어 순서를 설정하거나 반환합니다.

value 제출 버튼에 표시되는 텍스트를 설정하거나 반환합니다.

blur() 메소드는 제출 버튼에서 포커스를 제거합니다.

click()은 제출 버튼을 마우스로 클릭하는 것처럼 시뮬레이션합니다.

focus()는 제출 버튼에 포커스를 제공합니다.

메인 이벤트 onclick

9. 비밀번호 객체

비밀번호 객체는 웹페이지의 비밀번호 입력란에 해당합니다.

accessKey 속성은 비밀번호 필드에 접근하기 위한 단축키를 설정하거나 반환합니다.

alt 비밀번호 필드가 지원되지 않을 때 표시되는 대체 텍스트를 설정하거나 반환합니다.

defaultValue 비밀번호 필드의 기본값을 설정하거나 반환합니다.

disabled 비밀번호 필드를 비활성화해야 하는지 여부를 설정하거나 반환합니다.

id는 비밀번호 필드의 ID를 설정하거나 반환합니다.

maxLength는 비밀번호 필드의 최대 문자 수를 설정하거나 반환합니다.

name 비밀번호 필드의 이름을 설정하거나 반환합니다.

readOnly 비밀번호 필드가 읽기 전용인지 여부를 설정하거나 반환합니다.

size 비밀번호 필드의 길이를 설정하거나 반환합니다.

tabIndex는 비밀번호 필드의 탭 키 제어 순서를 설정하거나 반환합니다.

value는 비밀번호 필드의 value 속성 값을 설정하거나 반환합니다.

blur() 메소드는 비밀번호 필드에서 포커스를 제거합니다.

click()은 비밀번호 필드에 포커스를 둡니다.

focus() 비밀번호 필드에서 텍스트를 선택합니다.

주요 이벤트 onfocus, onblur, onselect, onchange

*History 객체

History 객체에는 사용자가 브라우저 창에서 방문한 정보가 포함되어 있습니다. ) URL.

History 개체는 window 개체의 일부이며 window.history 속성을 통해 액세스할 수 있습니다.

히스토리 객체 속성

속성 설명

length는 브라우저 기록 목록의 URL 수를 반환합니다.

기록 개체 메서드

메서드 설명

back()은 기록 목록의 이전 URL을 로드합니다.

forward()는 기록 목록의 다음 URL을 로드합니다.

go(number|URL)는 기록 목록의 특정 페이지를 로드합니다.

-1은 이전 페이지를 의미합니다.