JavaScript程序设计基础教程 第2版 普通高等教育“十一五”国家级规划教材 作者 阮文江 第八章 浏览器对象和 HTML DOM.pptVIP

8.3.4 替换元素 方法：使用被替换元素的父元素对象的方法 replaceChild(newnode,oldnode)。 例8.18 将所有水平线替换为一个小图片 需要借助父元素才能实现元素的替换 中山大学计算机科学系 * * 8.3.5 复制元素 方法：cloneNode(deep) 方法生成副本对象 深复制：deep 为 true 浅复制：deep 为 false 例8.19 将一个小图片重复显示5次 1、img 元素没有子元素，其深复制与浅复制效果相同 2、通过 cloneNode(deep) 生成的副本元素与原元素具有相同的 id 属性，有必要修改id 中山大学计算机科学系 * * 8.3.6 移动元素 方法：使用 appendChild(node)、insertBefore(node,[refnode]) 等方法，并且被添加的元素对象在当前 HTML DOM 树中已经存在 例8.20 第1个元素移至末尾 中山大学计算机科学系 * * 8.3.7 使用 innerText、innerHTML、outerText 和 outerHTML 属性 一、innerHTML 属性 读取:元素标签对之间的所有 HTML 代码 赋值:替换标签对之间的所有内容，从而可以创建、删除或替换子元素 例8.21 通过为 innerHTML 属性赋值使页面只显示“Hello World!” document.body.innerHTML = pHello World!/p; 中山大学计算机科学系 * * 8.3.7 使用 innerText、innerHTML、outerText 和 outerHTML 属性 二、outerHTML 属性 读取:表示元素的所有 HTML 代码（注：也包括元素自己的标签） 赋值:替换该元素及其所有子元素，从而可以删除或替换该元素 例8.22 去除页面中的所有超链接 links[i].outerHTML = span+links[i].innerHTML+/span; 中山大学计算机科学系 * * 8.3.7 使用 innerText、innerHTML、outerText 和 outerHTML 属性 三、innerText 属性 读取:元素标签对之间的文本 赋值:替换标签对之间的所有内容，从而可以删除元素中的所有子元素，只包含指定文本 四、outerText 属性 读取:与 innerText 相同 赋值:替换该元素，为一个文本节点 例8.23 将图像元素替换为相应 img 元素的 HTML 代码 中山大学计算机科学系 * * 8.3.7 使用 innerText、innerHTML、outerText 和 outerHTML 属性 五、异同 若 p 是对元素“p…/p”的引用： divpbHello/b World!/p/div 则 中山大学计算机科学系 * * 8.4 使用样式对象 可以使用 Style、StyleSheet 和 CurrentStyle 等样式对象操纵 HTML 页面的内嵌样式、嵌入样式表和链接外部样式表 中山大学计算机科学系 * * 8.4.1 Style 对象 元素对象的 style 属性引用一个 Style 对象, 包含与每个 CSS 样式属性相对应的属性： 若是单个单词，则同名。如 style.background、style.color 等 若是多个单词的连接，则去掉连字号（即“-”号）并且将第2个及后续单词的首字母改为大写形式（“驼峰式”）。如 style.fontFamily、style.fontSize、style.borderTopColor 等 例8.24 中山大学计算机科学系 * * 8.4.2 StyleSheet 对象 Document对象的属性 styleSheets 引用一个 StyleSheet 对象集合 StyleSheet 对象表示 HTML 文档中的一个独立样式表，即嵌入的样式表或链接的外部样式表 属性:rules、id、disabled、href 方法:addRule(sSelector, sStyle)、removeRule (iIndex) 例8.25 为嵌入样式表添加样式规则 例8.26 切换外部样式表 中山大学计算机科学系 * * 8.4.3 CurrentStyle 对象 元素对象的 currentStyle 属性引用一个 CurrentStyle 对象 与 Style 对象具有几乎相同的属性和方法,并且属性是只读的 表示页面中所有样式声明按 CSS 层叠规则作用于 HTML 元素的最终样式 而style 属性只表示元素的内嵌样式 例8.27 显示超链接的最终样式 中山大学计算机科学系 * * 中山大学计算机科学系 第