Section 4 脚本语言Script知识讲稿.ppt

3 Document object与文档对象模型 – 元素快速索引表 脚本程序在对文档树进行访问时，可能需要经常地访问文档中包 含的某类元素，例如“超链” “表单” “图像”等 文档对象模型提供了以下两种途径来供脚本程序访问文档树或者 其中某个子树上的所包含的某种特定类型的元素。这样，脚本程 序就不需要遍历整个文档树 ? doucment object具有一些属性，包括anchors, applets, forms, images, links, scripts等。每个属性返回的是一个集合，分别代 表HTML文档树中包含的所有的anchors, applets, forms, images, links, scripts等类型的结点 ? doucment object以及所有元素对象的all属性和children属性均 是一个集合，该集合支持tags方法，该方法的输入参数为代 表“元素种类”的字符串。该方法能够从all/ children集合中返 回由特定种类的元素所组成的子集合。 3 Document object与文档对象模型 ? 例如：doucment.all.tags(“IMG”)返回的是文档中所包含的所有 的img结点，等价于doucment.images object1.all.tags(“IMG”) 返回的是结点object1下包含的所有的img子孙结点，而 object1.children.tags(“IMG”)返回的是结点object1下的包含的 所有的img儿子结点 参见示例refobject – 元素标识符/名称 在HTML文档中，有些元素被设定了id或者name属性，这样，它 们在文档树上对应的结点的id或name属性也为非空值。 此时，id或name属性的值就会被作为这些结点的对象变量名，而 且这些对象变量名在整个文档的名字空间内是有效的。 脚本程序可以直接以“window.对象变量名”的形式来访问相应的结 点对象。 参见示例refobject 4 事件模型与event object 4.1 事件模型 – 事件 所谓“事件” （Event） 就是指用户对文档中的某个对象执行了某 种操作所产生的动作，比如点击超链元素、在页面上移动鼠标 在表单的文本框控件中输入、提交表单等都可以视为事件 这些事件可以分为以下三类 ? Web页面中所有元素均能够触发的一些标准的鼠标/键盘事件 ? 某些能够接收焦点的元素均能够触发的一些事件 ? 特定的元素所能够触发的一些独特的事件 4 事件模型与event object Web页面中所有元素均能够触发的一些标准的鼠标/键盘事件 包括 ? onkeydown 用户按下某个按键 ? onkeyup 用户松开某个按键 ? onmousedown 用户按下鼠标按钮 ? onmouseup 用户松开鼠标按钮 ? onclick 用户点击鼠标按钮或在表单中的按钮控件上按 下Enter按键或在表单中的checkbox radio等控件上按 下Space按键等等 ? ondblclick 用户双击鼠标按钮 ? onmouseover 用户将鼠标移到某个元素上 ? onmousemove 用户在某个元素上移动鼠标 ? onmouseout 用户将鼠标移出某个元素 4 事件模型与event object 某些能够接收焦点的元素均能够触发的一些事件 ? onfocus 当用户使用TAB按键或者鼠标将焦点移动按钮、 超链、文本框等元素上时 ? onblur 当用户使用TAB按键或者鼠标将焦点从按钮、超 链、文本框等元素上移开时，Fires when an object, such as a button or check box, loses the input focus ? 参见示例event 特定的元素所能够触发的一些独特的事件 ? FORM元素所具有的onreset/onsubmit事件（用户提交/重置表 单） ? INPUT SELECT TEXTAREA元素所具有的onchange事件 （用户改变了表单中输入控件的值） ? 参见示例event 4