前言DOM(Document Object Model)即文档对象模型,针对 HTML 和 XML 文档的 API(应用程序接口)。DOM 描绘了一个层次化的节点树,运行开发人员添加、移除和修改页面的某一部分。DOM 脱胎于 Netscape 及微软公司创始的 DHTML(动态 HTML),但现在它已经成为表现和操作页面标记的真正跨平台、语言中立的方式。阅读目录基本概念节点创建型api页面修改型API节点查询型API节点关系型api元素属性型api元素样式型api总结文本整理了javascript操作DOM的一些常用的api,根据其作用整理成为创建,修改,查询等多种类型的api,主要用于复习基础知识,加深对原生js的认识。基本概念在讲解操作DOM的api之前,首先我们来复习一下一些基本概念,这些概念是掌握api的关键,必须理解它们。Node类型DOM1级定义了一个Node接口,该接口由DOM中所有节点类型实现。这个Node接口在JS中是作为Node类型实现的。在IE9以下版本无法访问到这个类型,JS中所有节点都继承自Node类型,都共享着相同的基本属性和方法。Node有一个属性nodeType表示Node的类型,它是一个整数,其数值分别表示相应的Node类型,具体如下:Node.ELEMENT_NODE:1Node.ATTRIBUTE_NODE:2Node.TEXT_NODE:3Node.CDATA_SECTION_NODE:4Node.ENTITY_REFERENCE_NODE:5Node.ENTITY_NODE:6Node.PROCESSING_INSTRUCTION_NODE:7Node.COMMENT_NODE:8Node.DOCUMENT_NODE:9Node.DOCUMENT_TYPE_NODE:10Node.DOCUMENT_FRAGMENT_NODE:11Node.NOTATION_NODE:12假设我们要判断一个Node是不是元素,我们可以这样判断if(someNode.nodeType == ){ console.log("Node is a element"); } 这些Node类型中,我们最常用的就是element,text,attribute,comment,document,document_fragment这几种类型。我们简单来介绍一下这几种类型:Element类型Element提供了对元素标签名,子节点和特性的访问,我们常用HTML元素比如div,span,a等标签就是element中的一种。Element有下面几条特性:(1)nodeType为1(2)nodeName为元素标签名,tagName也是返回标签名(3)nodeValue为null(4)parentNode可能是Document或Element(5)子节点可能是Element,Text,Comment,Processing_Instruction,CDATASection或EntityReference