精华内容
下载资源
问答
  • JavaScript操作DOM对象

    2021-01-23 00:51:33
    dom是Document Object Model的缩写,即文档对象模型,是基于文档编程的一套API接口,1998年,W3C发布了第一级的DOM规范,规范允许访问和操作HTML页面中的每个单独元素,如网页的表格,图片,文本,表单元素等,由于...

    目录

     

    一.DOM操作

    (一).DOM操作分类

    (二).节点和节点的关系

    (三).访问节点

     (四).节点信息

    二.操作节点

    (一)操作节点的属性

    (二).创建和插入节点

    (三).删除和替换节点

    (四).操作节点样式


    一.DOM操作

    dom是Document Object Model的缩写,即文档对象模型,是基于文档编程的一套API接口,1998年,W3C发布了第一级的DOM规范,规范允许访问和操作HTML页面中的每个单独元素,如网页的表格,图片,文本,表单元素等,由于大部分主流的浏览器都执行了这个标准,因此基本解决了浏览器的兼容问题。

    使用javascript操作DOM时分为三个方面,DOMCore(核心),HTML——DOM和CSS-Dom.通过这些标准,开发人员可以让网页真正拖动起来,动态的增加,修改,删除数据,使用户与计算机的交互更加便捷,交互也更加丰富。

    (一).DOM操作分类

    使用Javascript操作DOM时通常分为三类,DOM Core(核心),HTML-DOM 和Css-DOM

    (二).节点和节点的关系

    DOM是以树状结构组织的HTML文档,HTML文档中的每个标签或元素都是一个节点。

    --整个文档是一个文档节点

    --每个HTML标签是一个元素节点

    --包含在HTML元素中的文本是文本节点

    --每个HTML属性是一个属性节点

    --注释属于注释节点

    文档节点结构图

    1.使用父(parent),子(child)和同胞(sibing)等术语来描述这些节点的层级关系.父节点拥有子节点,同级子节点被称为同胞或兄弟节点。

    --在节点树中,顶部节点被称为根(root)。

    --每个节点都有父节点,除了根(它没有父节点)。

    -- 一个节点可以拥有任意数量的子节点。

    -- 同胞节点是拥有相同父节点的节点。

    (三).访问节点

    使用DOM Core访问HTML文档的节点主要有两种方式:
    --使用getElement系列方法访问指定节点,
    --根据节点的层次关系访问节点。

    1.使用getElement系列方法访问指定节点:

    访问节点的标准方法就是用getElement 系列,

    --getElementById():返回按id属性查找的第一个对象的引用。

    --getElementsByName():返回按带有指定名称name查找的对象的集合,返回的是元素数组。

    --getElementsByTagName():返回带有指定标签名Tag Name查找的对象的集合,返回的是元素数组。

    2.根据层次关系访问节点

    节点属性(节点[包含元素,文本,属性,注释])
    属性名称 描述
    parentNode 返回节点的父节点
    chiildNodes 返回子节点集合 childNoeds[i]
    fistChild 返回节点的第一个子节点,最普遍的用法是访问该元素的文本信息
    lastChild 返回节点的最后一个子节点
    nextSibing 下一个节点
    previousSibling 上一个节点

    在Javascript中有一组可兼容不同浏览器的element属性

    element属性(节点<标签元素>)
    属性名称 描述
    fistChildElementChild 返回节点的第一个子节点,最普遍的用法是访问该元素的文本信息
    lastElementChild 返回节点的最后一个子节点
    nextElementSibing 下一个节点
    previousElementSibing 上一个节点

     (四).节点信息

    节点是DOM层级中的任何类型的对象的通用名称,每个节点都拥有包含着关于节点某些信息的属性

    --nodeName(节点名称)

    --nodeValue(节点属性)

    --nodeType   (节点类型)

    节点类型
    节点类型 NodeType值
    元素element 1
    属性attr 2
    文本text 3
    注释comments 8
    文档document 9

    二.操作节点

    (一)操作节点的属性

    --getAttribute(“属性名”) 用来获取属性的值 ,当属性不存在则getAttribute()返回null。

    --setAttribute(“属性名,属性值”) 用来设置属性的值 。

    (二).创建和插入节点

    使用javascript 操作DOM有很多方法可以创建或增加一个新节点

    创建和插入节点
    名称 描述
    createElement(tagName) 创建一个标签名为tagName的新元素节点
    A.appendChild(B) 把B节点追加至A节点的末尾
    inserBefore(A,B) //使用父节点插入 把A节点插入B节点之前
    cloneNode(deep) 复制某个指定的节点

    (三).删除和替换节点

    名称 描述
    removeChild(node) 删除指定的节点
    replaceChild(newNode,oldNode)

    用其他的节点替换指定的节点

    方法replaceChild(newNode,oldNode)中的两个参数,newNode是替换的新节点,oldNode是要被替换的节点

    (四).操作节点样式

    在javascript中,有两种方式可以动态的改变样式的属性

    --使用style属性

    style是一个对象,代表一个单独的样式声明,可通过应用样式的文档或元素访问Style对象,

    1.style语法
        HTML元素.style.样式属性=“值”
    style属性的常用属性
    类别 属性 描述
    background(背景) backgroundColor 设置元素的背景色
    backgroundImage 设置元素的背景图像
    backgroundRepeat 设置元素的背景图像是否重复
    text(文本) fontSize 字体的大小
    fontWeight 字体的粗细
    textAlign 排列文本
    textDecotation 文本的修饰
    font 设置同一行字体的属性
    color

    设置文本的颜色

    padding(边距) padding  内边距
    边框 border 边框属性

     

     

     

     

     

     

     

     

     

     

     

     

     

    --使用className属性

    1.语法
         HTML元素.className="样式名称"

    获取元素的样式

    在javascript中可以使用style属性获取样式的属性值

    1.语法
        HTML元素.style。样式属性;(获取内联样式)

    事件

    常用的事件
    名称 描述
    onclick 点击事件
    onmouseover 鼠标移动到某元素之上
    onmouseout 鼠标从某元素之上移开
    onmousedown 鼠标按钮被按下

     

    展开全文
  •  实例115 使用面向对象思想查找字符串中的所有数字 140 5.3 面向对象技术高级应用 141  实例116 自定义抽象类计算圆形的面积 141  实例117 利用接口实现选择不同的语言 143  实例118 使用密封类密封用户信息...
  • 7.3.4 绘制图表中的表格 7.3.5 绘制条形图 7.3.6 绘制面形图 7.3.7 绘制饼形图 8章 电子邮件收发模块 8.1 概述 8.2 关键技术 8.2.1 Base64编码格式 8.2.2 SMTP服务 8.2.3 POP3协议 8.2.4 使用Jmail组件接收邮件 ...
  • 简单来说是本身可视为电子化的文件柜——存储电子文件的处所,用户可以对文件中的数据运行新增、截取、更新、删除等操作。 常见的数据模型 1. 层次结构模型: 层次结构模型实质上是种有根结点的定向有序树,IMS...
  • jquery电子文档chm

    2010-01-09 22:46:25
    访问第一个匹配元素样式属性。 -------------------------------------------------------------------------------- Return a style property on the first matched element. 返回值 String 参数 name (String...
  • 实例112 统计用户在某一页停留时间 实例113 应用session对象实现用户登录 实例114 统计用户在站点停留时间 实例115 判断用户是否在线 实例116 实时统计在线人数 4.3 JSP自定义标签 实例117 带标签体...
  • 实例112 统计用户在某一页停留时间 实例113 应用session对象实现用户登录 实例114 统计用户在站点停留时间 实例115 判断用户是否在线 实例116 实时统计在线人数 4.3 JSP自定义标签 实例117 带标签体...
  • getElementById 获取对 ID 标签属性为指定值的第一对象的引用。 getElementsByName 根据 NAME 标签属性值获取对象的集合。 getElementsByTagName 获取基于指定元素名称的对象集合。 hasFocus 获取表明对象...
  • 14章 javabean组件在jsp文档中的应用 14.1 使用bean的原因 14.2 bean是什么 14.3 bean的应用:基本任务 14.4 示例:stringbean 14.5 设置bean的属性:高级技术 14.6 共享bean 14.7 共享bean的4种...
  • 实例229 用First或Last求数据表中第一条或最后一条 7.11 多表查询(连接查询) 实例230 多表连接查询 实例231 在连接查询使用表别名 实例232 使用UNION关键字合并多个结果集 7.12 嵌套查询 实例233 简单...
  • 实例229 用First或Last求数据表中第一条或最后一条 7.11 多表查询(连接查询) 实例230 多表连接查询 实例231 在连接查询使用表别名 实例232 使用UNION关键字合并多个结果集 7.12 嵌套查询 实例233 简单...
  • 实例195 实现选中、编辑和删除GridView中的商品信息 310 实例196 供求信息网审核发布信息(审核权限设置) 312 实例197 获取GridView控件中隐藏的列值 314 实例198 在GridView控件中实现商品信息自动编号 315 实例199 ...
  • 实例195 实现选中、编辑和删除GridView中的商品信息 310 实例196 供求信息网审核发布信息(审核权限设置) 312 实例197 获取GridView控件中隐藏的列值 314 实例198 在GridView控件中实现商品信息自动编号 315 实例199 ...
  • 实例195 实现选中、编辑和删除GridView中的商品信息 310 实例196 供求信息网审核发布信息(审核权限设置) 312 实例197 获取GridView控件中隐藏的列值 314 实例198 在GridView控件中实现商品信息自动编号 315 实例199 ...
  • iPhone开发秘籍(2版)--源代码

    热门讨论 2012-12-11 13:51:22
    iPhone开发秘籍:第2版(iphone开发必备佳作,在第一基础上进行了全面修订和大量扩充) 基本信息 原书名: The iPhone Developer's Cookbook: Building Applications with the iPhone 3.0 SDK (2nd Edition) 原...
  • iPhone开发秘籍(2版)--详细书签版

    热门讨论 2012-12-11 13:42:25
    iPhone开发秘籍:第2版(iphone开发必备佳作,在第一基础上进行了全面修订和大量扩充) 基本信息 原书名: The iPhone Developer's Cookbook: Building Applications with the iPhone 3.0 SDK (2nd Edition) 原...
  • 书名:《Java开发实战1200例(II卷)》(清华大学出版社.李钟尉,陈丹丹) PDF格式扫描版,全书分为6篇21章,共905。2011年6月出版。 全书压缩打包成2部分,这是1部分。 注:本电子版缺失了19-21章部分,仅...
  • 书名:《Java开发实战1200例(II卷)》(清华大学出版社.李钟尉,陈丹丹) PDF格式扫描版,全书分为6篇21章,共905。2011年6月出版。 全书压缩打包成2部分,这是2部分。 注:本电子版缺失了19-21章部分,仅...
  • 第一卷介绍了TCP/IP基本概念,第二卷在第一基础上,进一步详细讨论了TCP/IP实现过程,这一卷突出特点是非常注重实际。本书作者利用程序代码实现了TCP/IP每一个具体细节,并且所有代码在书均可找到...
  • 书名:《Java开发实战1200例(I卷)》(清华大学出版社.李钟尉,陈丹丹) PDF格式扫描版,全书分为24章,共817。2011年1月出版。 全书压缩打包成4部分,这是3部分 注:本系列图书的第I、II卷再版时均相应改名为...

空空如也

空空如也

1 2 3 4 5 ... 11
收藏数 218
精华内容 87
关键字:

删除文档第一页中的表格对象