JavaScript前端开发程序设计教程 第2版 配套课件.ppt

通过表单的ID来访问表单 首先，我们需要给表单或者表单元素来定义一个id属性，然后使用document.getElementById()方法来或获取对应的DOM对象。语法如下。 var myForm=document.getElementById(myFormId);//myFormId为表单的id var userName=document.getElementById(userId);//userId为表单中控件的id 通过表单名称来访问表单 首先，我们需要给表单或者表单元素定义一个name属性，然后使用document.getElementsByName()方法来获取对应的DOM对象。语法如下。 //myForm为表单的name属性 var myForm=document.getElementsByName(myForm)[0]; //userName为表单中控件的name属性 var userName=document.getElementsByName(userName)[0]; 通过表单标签名来访问表单 在这里，我们不需要定义任何属性，而是直接使用document.getElementsByTagName()方法来获取对应的DOM对象。语法如下。 var obj=document.getElementsByTagName(input); 目录 1 表单和表单对象 2 访问表单和表单元素 3 操作表单对象 操作表单对象 通过前面的学习，我们通过三种方式访问了表单对象，接下来我们看一下获取到的表单对象，有哪些操作。 禁用和启用表单对象 表单对象的disabled属性，如果设置为true，代表禁用这个表单对象，反之，将启用这个表单对象。 表单对象获得和失去焦点 当我们的页面上有多个文本框时，我们需要在某个文本框双击，那么这个文本框就获得了焦点，也可以使用表单对象的focus()方法，同样如果想让某个表单对象失去焦点，那么可以使用blur()方法。 提交表单 提交表单是指将用户在表单中填写或选择的内容传送给服务器端的特定程序（action属性指定），然后由该程序进行具体的处理。 将表单数据提交给服务器的方法有两种。第一种方法是单击表单中的“提交”按钮；第二种方法是调用表单对象的submit()方法。这两种方法基本相同，不同之处在于第一种方法是执行事件处理函数onsubmit，并且可能阻止表单提交，第二种方法是将数据直接提交给服务器。在这里我们使用方法一介绍表单的提交。语法如下。 form id=fm method=post action= onsubmit=return check() 重置表单 重置表单是指对用户在表单中填写或选择的内容进行重新设置，调用表单的reset()方法，语法如下。 myform.reset(); 处理页面事件 页面事件是在页面加载或者改变浏览器大小、位置，以及对页面的滚动条进行操作时触发的事件。 页面加载与卸载事件 加载事件（onload）是在网页加载完成后触发相应的事件处理程序，它可以在页面加载完成后，对页面中的表格样式、字体、背景颜色进行设置。卸载事件（unload）是在卸载网页时触发相应的事件处理程序，卸载网页指的是关闭当前页，或从当前页跳转到其他网页。该事件通常被用于在关闭当前页面或跳转其他网页时，弹出询问对话框。 1．body元素绑定 onload 事件 body元素绑定 onload 事件后，当浏览器中当前 HTML 文档装载完成就会触发 onload 事件，页面中的脚本就可以访问页面中的任意元素。根据onload 元素的这种特性，可以将需要在页面载入后立即执行的脚本放在onload 事件处理函数中，脚本的执行不受 onload 事件处理函数的定义位置和访问的元素在页面中的先后顺序影响。 页面加载与卸载事件 2．window元素绑定 onload 事件 对于可以绑定到body元素的一些页面事件（如 onload、onunload、 onresize 和 onerror 等）也可以绑定到 window 对象，效果基本相同。 页面大小事件 页面的大小事件（onresize）是用户改变浏览器大小时触发事件处理程序，主要用于固定浏览器的大小。 01 事件的概念 事件对象 处理鼠标事件 处理键盘事件 处理页面事件 处理文本编辑事件 02 03 04 05 06 CONTENTS 目录 处理文本编辑事件 JavaScript 可以对页面内容（文本） 进行复制、 剪切、 粘贴和拖放等编辑操作。 通过 JavaScript的相关操作事件完成此类操作。 处理文本选中区域 1．选中区对象（Selection 对象） Selection 对象是选中区对象，即在