1. H5自定义属性
目的：用于保存并使用数据。有些数据可以保存到页面中而不用保存到数据库中。
由于有些自定义属性很容易引起歧义，难以判断是元素内置属性还是自定义属性。
H5给我们新增了自定义属性：
1.1 设置H5自定义属性
H5规定自定义属性 date-开头作为属性名并且赋值
如:
<div date-index = "1" ></div>
兼容性获取element.getAttribute(data-index)H5新增方法element.dataset.index或element.dataset[index]获取。（ie11或以上才能使用）如果自定义属性里面有多个链接的单词，则使用驼峰命名法获取。
Warning
对于element.dataset.index和element.dataset[index]方法，注意index和data-index中的要对应。
<body><div getTime="20" data-index="2" data-list-name="lili"></div><script>var div = document.querySelector(div);console.log(div.getTime); //undefineconsole.log(div.getAttribute(getTime)); //20console.log(div.getAttribute(data-list-name)); //这种方法直接这样写div.setAttribute(data-time, 20);// H5新增的获取自定义属性的方法// dataset是一个集合，里面存放了所有以data开头的自定义属性console.log(div.dataset); //有两个 2和20console.log(div.dataset.index); //2 （取其中的index）// 如果自定义属性里有多个单词，新增方法用驼峰法获取console.log(div.dataset.listName); //lili console.log(div.dataset[listName]); //lili 也可以这样表示</script></body>
2. 节点操作
2.1 为什么学习节点操作
获取元素通常使用两种方式:
利用DOM提供的方法获取元素，缺点：逻辑性不强、繁琐
document.getElementByld()document.getElementsByTagName()document.querySelector()
利用节点层级关系获取元素
利用父子兄节点关系获取元素优点：逻辑性强缺点：兼容性稍差
两种方式都可以获取节点，但节点操作更简单
2.2 节点概述
网页中的所有内容都是节点(标签、属性、文本、注释等），在DOM中，节点使用node来表示。
HTML DOM 树中的所有节点均可通过 JavaScript 进行访问，所有 HTML 元素（节点）均可被修改，也可以创建或删除。
一般地，节点至少拥有nodeType(节点类型)、nodeName(节点名称）和nodeValue(节点值）这三个基本属性。
三种基本节点类型：
元素节点nodeType为1属性节点nodeType为2文本节点nodeType为3（文字、空格、换行）
实际开发中，主要操作的还是元素节点。
2.3 节点层级
2.3.1 父级节点
获取离元素最近的父节点，若找不到则返回null。
node.parentNode
DOM—操作元素（H5自定义属性） 节点操作（子 父 兄弟节点 创建 添加节点 删除节点 复制节点）
