JavaScriptDOM

眉间皱痕 提交于 2020-03-23 10:11:27

 

一、DOM是什么(重点重点)

Document Object Model 文档对象模型

DOM 定义了访问和操作HTML的文档的标准和方法

DOM 可以将HTML 分为元素 文本 属性 结构树(节点树)

使用DOM 可以改变HTML里面的某个项目包含 删除  增加 修改

二、DOM分为3个部分

1.XMLDOM  针对XML文档对象

2.HTMLDOM 针对HTML文档对象

3.COREDOM  针对所有结构化文档对象

三、XML(可扩展的标记语言) 是一种灵活简单的文本格式

1.XML其实就是自定义一些标签用来存储数据  进行数据交互

2.HTML标记语言 主要用来页面遵循的一些规则和规范

XML 可扩展的语言  用来存储 微信开发我们会用到

3.HTMLDOM XMLDOM -------> C语言和php之间的关系

4.HTMLDOM里面的语法都可以在XMLDOM里面使用但是XMLDOM里面的语法HTMLDOM中有的没有

四、HTMLDOM(重点重点重点)

1.节点: HTML里面的每个成分都是一个节点

2.节点信息

(1)nodeName(节点名称)

  1. 元素节点  nodeName   是标签名
  2. 属性节点  nodeName   是属性名称
  3. 文本节点  nodeName   永远都是#text
  4. 文档节点  nodeName   永远都是#document

(2)nodeValue(节点值)

  1. 对于文本节点   nodeValue  显示文本内容
  2. 对于属性节点  nodeValue  显示属性值
  3. nodeValue 对于文档节点和元素节点不可用的

(3)nodeType(节点类型)

  1. 元素   1
  2. 属性   2
  3. 文本   3
  4. 注释   8
  5. 文档   9

3.定点节点(找对象)

(1)document.getElementById()

(2)document.getElementsByTagName()

(3)document.getElementsByName()

(4)document.getElementsByClassName()

(5)根节点(不用我们找就可以直接使用的对象)

  1. html     document.documentElement
  2. body     document.body

4.属性(查找节点)

(1)firstChild  第一个儿子

(2)lastChild  最后一个儿子

(3)childNodes  所有子节点(集合)

(4)children     所有子元素的集合(不显示其他节点)

(5)parentNode   父节点

(6)nextSibling     下一个兄弟节点

(7)previousSibling  上一个兄弟节点

(8)attributes       所有属性集合

5.方法操作(添加 修改 删除)

(1)创建节点

document.createElement(‘要创建的标签名’)

(2)添加节点

  1. 添加到最后appendChild

parent.appendChild(son);

  1. 添加到某个位置insertBefore

parent.insertBefore(son,position)

(3)克隆

new  = old.cloneNode();

如果我们传递一个参数参数值为true 表示携带子元素一起克隆

(4)删除子节点

  parent.removeChild(son)

(5)删除自己节点

 son.parentNode.removeChild(son)

五、全选反选 删除

因为删除每次数组都会重新排序 所以我们要从大到小的删除或者只删除0下标的内容进行操作即可

六、移动选项卡特效

获取select里面的所有option标签

select对象.options 获取所有option标签

七、表格属性

  1. 添加行  insertRow() 创建并添加操作

添加行的对象是我们的表格对象

  1. 添加单元格 insertCell()

添加单元格的对象是我们的行的对象

  1. 删除单元格 deleteCell(index)

index代表你要删除单元格所在位置数

  1. 获取当前单元格序号cellIndex属性

八、表格的增加和删除

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!