之前一直傻傻分不清DOM和JavaScript究竟有什么区别,随着相关工作时间的增长,开始逐渐区分DOM和JavaScript了,最近,也一直在复习有关DOM方面的知识,《JavaScript DOM编程艺术》,就是他了,也看了好几遍了,做一点阶段性的总结吧!由于完全是基础知识,也就完全总结基础知识相关的吧!

DOM选取元素:

document.getElementById            通过id选取元素

document.getELmentsByTagName      通过标签名选取元素

document.getElementsByName       通过元素属性name获取元素

document.getElementsByClassName     通过className获取元素,html5新增

这几个选择元素的方法也确实没什么好说的,基本上写过原生js的,应该都用过

document.querySelector(css)       获取文档中匹配指定 CSS 选择器的一个元素

document.querySelectorAll(css)       返回文档中匹配的CSS选择器的所有元素节点列表

这两个方法也是html5新增,参数css选择器,可以是任意一个或多个匹配元素的 CSS 选择器。 可以使用它们的 id, 类, 类型, 属性, 属性值等来选取元素。

DOM元素节点属性

elem.childNodes             元素elem的所有子元素,包括文本节点,元素节点,甚至注释节点

elem.parentNode              元素elem的父节点,为元素节点

elem.nextSibling             元素elem之后紧跟的节点(处于同一树层级中)
elem.previousSibling           元素elem之前的节点(处于同一树层级中) 

elem.firstChild              元素elem第一个子节点

elem.lastChild              元素elem最后一个子节点

document.createElement()       创建一个元素节点,元素名称为所传入的参数

document.createTextNode()       创建一个文本节点,文本内容以参数传入

document.createDocumentFragment()   创建空的 DocumentFragment 对象,并返回此对象。 

elem.appendChild(node)           在元素elem内部追加子节点node  

elem.insertBefore(newElem, targetElem)   在elem元素内部的targetElem元素前面添加新的元素newElem

elem.getAttribute(attr)           获取elem元素的属性attr

elem.setAttribute(attr, 'attr')        设置elem元素的属性attr为attr

以上,应该为DOM常用的一些属性和方法了。一直觉得DOM内容很多,突然发现,常用的也就那么些,就纯粹当做一个笔记吧!

        

DOM常用的属性和方法的更多相关文章

  1. dom对象常用的属性和方法有哪些?

    dom对象常用的属性和方法有哪些? 一.总结 一句话总结: 1.document属性和方法:document的属性有head,body之类,方法有各种获取element的方法 2.element的属性 ...

  2. HTML DOM对象的属性和方法

    HTML DOM对象的属性和方法 HTML DOM 对象有几种类型: 1.Document 类型 在浏览器中,Document 对象表示整个 HTML 文档. 1.1属性 引用文档的子节点 docum ...

  3. HTML DOM对象的属性和方法介绍(原生JS方法)

    HTML DOM对象的属性和方法介绍 DOM 是 Document Object Model(文档对象模型)的缩写. DOM(文档对象模型)是针对HTML和XML文档的一个API(应用程序编程接口), ...

  4. HTML中DOM对象的属性和方法的层级关系是怎样的?(目录即层次)

    HTML中DOM对象的属性和方法的层级关系是怎样的?(目录即层次) 一.总结 一句话总结:目录就是测试题 1.document取得元素(get element)的方式有哪几种? 解答:四种,分别是id ...

  5. FileStream常用的属性和方法:

    对流进行操作时要引用 using System.IO; 命名空间 FileStream常用的属性和方法: 属性: CanRead 判断当前流是否支持读取,返回bool值,True表示可以读取 CanW ...

  6. FileStream常用的属性和方法 (转)

    对流进行操作时要引用 using System.IO; 命名空间 FileStream常用的属性和方法: 属性: CanRead 判断当前流是否支持读取,返回bool值,True表示可以读取 CanW ...

  7. FileStream 常用的属性和方法

    FileStream常用的属性和方法 (转) 对流进行操作时要引用 using System.IO; 命名空间 FileStream常用的属性和方法: 属性: CanRead 判断当前流是否支持读取, ...

  8. JavaScript常用全局属性与方法

    最近,在学习JavaScript,Java作域链包含全局,记录下常用的全局属性与方法,就当是知识的积累,未列出全部,如需查看全部可参考JS相关的API文档. 常用的全局属性:  全局属性      作 ...

  9. js Dom对象的属性与方法

    1.对象集合:      (1).all[];      (2).images[];      (3).anchors[];      (4).forms[];      (5).links[];   ...

随机推荐

  1. SQL 更新修改删除一个表,库存自动增减的写法

    create trigger tri_asbon asb for insert as begin declare @rk int declare @ck int declare @sid varcha ...

  2. RedHat6.5安装zookeeper集群

    版本号: Redhat6.5  zookeeper-3.4.6  JDK1.8 zookeeper下载 官网下载地址:https://mirrors.tuna.tsinghua.edu.cn/apac ...

  3. GTX log 6

    5.24-7.2 相关算法 判断两颗二叉树相等 有两种方法:一种是递归比较.另一种是二叉树的遍历. 先说二叉树的遍历.由于先序遍历 再加上 中序遍历能唯一确定一棵二叉树.故,对这两棵树分别进行先序和中 ...

  4. oracle rac的启动与停止

    引言:这写篇文章的出处是因为我的一名学生最近在公司搭建RAC集群,但对其启动与关闭的顺序和原理不是特别清晰,我在教学工作中也发现了很多学员对RAC知识了解甚少,因此我在这里就把RAC里面涉及到的最常用 ...

  5. 2017.11.13 flex 布局相关问题

    一.今日任务:城市体验平台小程序的开发(由于数据还未完善,今天主要是 UI 布局的开发) 二.所遇问题 1. flex 布局问题: html: <view class="flex-sp ...

  6. xe5 android tts(Text To Speech) [转]

    TTS是Text To Speech的缩写,即“从文本到语音”,是人机对话的一部分,让机器能够说话. 以下代码实现xe5 开发的文本转语音的方法 和访问蓝牙一样,这里用javaclass的接口实现 接 ...

  7. 创建virtualenv虚拟环境

    这个部分知识我在之前的随笔里记过笔记. 传送门:http://www.cnblogs.com/0bug/p/8598458.html 本文只演示Windos下virtualenv环境的使用: 首先,确 ...

  8. 不可小视的String字符串

    String印象 String是java中的无处不在的类,使用也很简单.初学java,就已经有字符串是不可变的盖棺定论,解释通常是:它是final的. 不过,String是有字面量这一说法的,这是其他 ...

  9. mysql 事务学习

    1.事务 逻辑上的一组操作,组成这组操作的各个逻辑单元要么一起成功,要么一起失败. 2.事务特性 原子性:强调事务的不可分割.一致性:强调的是事务的执行的前后,数据的完整性要保持一致.隔离性:一个事务 ...

  10. 详解MySQL主从复制实战 - 基于GTID的复制

    基于GTID的复制 简介 基于GTID的复制是MySQL 5.6后新增的复制方式. GTID (global transaction identifier) 即全局事务ID, 保证了在每个在主库上提交 ...