[计算机软件及应用]Web客户端JavaScript1.pptVIP

ul id=xueke li id=wuli统计物理/li li id=shuxue数学 /li li id=english英语/li /ul 案例 获取列表元素 读取元素的HTML属性 设置元素HTML属性 重要案例 动态时间 表单验证一系列 元素属性的获取与设置，删除 元素CSS的增，删，改 随机验证码 表格隔行变色 LIGHTBOX 常见的错误 HTML-DOM HTML-DOM 根据DOM的规定，HTML文档中的每个成分都是一个节点。 整个文档是一个文档节点 每个HTML标签是一个元素节点 包含在HTML元素中的文本是文本节点 每个HTML属性是一个属性节点 注释属于注释节点 通过DOM，可以访问HTML文档中的每个节点 节点的方法 特性/方法 类型/返回类型 说??? 明 nodeName String 节点的名字；根据节点的类型而定义 nodeValue String 节点的值；根据节点的类型而定义 nodeType Number 节点的类型常量值之一 ownerDocument Document 指向这个节点所属的文档 firstChild Node 指向在childNodes列表中的第一个节点 lastChild Node 指向在childNodes列表中的最后一个节点 childNodes NodeList 所有子节点的列表 previousSibling Node 指向前一个兄弟节点；如果这个节点就是第一个兄弟节 点，那么该值为null nextSibling Node 指向后一个兄弟节点；如果这个节点就是最后一个兄弟节点，那么该值为null hasChildNodes() Boolean 当childNodes包含一个或多个节点时，返回真 attributes NamedNodeMap 包含了代表一个元素的特性的Attr对象；仅用于Element节点 appendChild(node) Node 将node添加到childNodes的末尾 removeChild(node) Node 从childNodes中删除node replaceChild(newnode, oldnode) Node 将childNodes中的oldnode替换成newnode insertBefore(newnode, refnode) Node 在childNodes中的refnode之前插入newnode JavaScript DOM的属性 节点的属性 nodeName 属性将返回一个字符串，其内容是给定节点的名字。 如果节点是元素节点，返回这个元素的名称； 如果是属性节点，返回这个属性的名称； 如果是文本节点，返回一个内容为#text 的字符串； nodeType 属性将返回一个整数，这个数值代表给定节点的类型 Node.ELEMENT_NODE ---1 -- 元素节点 Node.ATTRIBUTE_NODE ---2 -- 属性节点 Node.TEXT_NODE ---3 -- 文本节点 nodeValue 属性将返回给定节点的当前值 如果节点是元素节点，返回null； 如果是属性节点，返回这个属性的名称； 如果是文本节点，返回文本节点的内容； JavaScript DOM的属性 遍历节点树 childNodes: 该属性返回一个数组，这个数组由给定元素节点的子节点构成 firstChild : 返回第一个子节点 lastChild : 返回最后一个子节点 nextSibling : 返回给定节点的下一个子节点 parentNode : 返回一个给定节点的父节点 nextSibling :获取该节点的下一个同级节点对象 previousSibling :获取该节点的上一个同级节点对象 attributes :获取对象标签属性的集合 elements :获取该节点下所有元素 DOM编程在HTML页面中的应用 （1）访问指定节点； （2）访问相关节点； （3）访问节点属性； （4）检查节点类型； （5）创建节点； （6）操作节点。 1. 访问指定节点 getElementById() 如getElementById(“one”) getElementsByName( ) 如name属性相同的元素 getElementsByTagName( ) document.getElementsByTagName(p)[3] 访问相关节点 “访问相关节点”的含义是根据已知的节点，寻找和它存在联系的节点，如父节点、子节点、兄弟节点等。 （1）访问html节点和body节点 （2）访问子节点 ① childNodes：子节点的列表； ② firstChild：