一、改变元素内容 有两种方式 innerText 和 innerHTML
相同点：这两个属性是可读写的，可以获取元素中的内容
区别：
1.innerText 在获取标签中的内容时，会去除空格和换行 非标准的
2. innerText 不识别 html 标签，如果想给插入的文本加入样式，需要使用innerHTML
3.innerHTML 在获取标签中的内容时，会保留空格和换行 W3C标准 识别 html 标签
案例：
var p = document.querySelector('p');
var p = p.innerHTML='<strong>今天是：</strong>123';
var p1 = p.innerText='<strong>今天是：</strong>123';
console.log(p); // 今天是：123
console.log(p1); // <strong>今天是：</strong>123
二、修改样式属性
1.element.style 行内样式操作
注意：
1.JS 里面的样式采取驼峰命名法 比如 fontSize、backgroundColor
2.JS 修改 style 样式操作，产生的是行内样式，css 权重比较高
2.element.className 类名样式操作
注意：
1.如果样式修改较多，可以采取操作类名方式更改元素样式
2.class 因为是个保留字，因此使用 className 来操作元素类名属性
3. className 会直接更改元素的类名，会覆盖原先的类名
4.如果想要保留原先的类名，我们可以使用多类名选择器
例：this.className=' 原类名 新增的类名 ';
三、设置和移除自定义属性
1.获取属性值（两种方式）
element.属性； 获取属性值 获取内置属性值（元素本身自带的属性）
element.getAttribute( '属性' )； 主要获得自定义的属性（标准）兼容性好
2.设置属性值（两种方式）
element.属性 = ' 值 ' ； 设置内置属性值
element.setAttribute('属性'，'值')； 主要设置自定义的属性值（标准）
3.移除属性
element.removeAttribute('属性')；
4.H5自定义属性
h5 新增的获取自定义属性的方法，它只能获取 data- 开头的
<div data-index='3' data-list-name='andy'></div>
var div = document.querySelector('div')；
dataset 是一个集合里面存放了所有以 data 开头的自定义属性
console.log( div.dataset.index ) ； // 方式一
console.log( div.dataset['index'] )； // 方式二
如果自定义属性里面有多个 - 链接的单词，我们获取的时候采取 驼峰命名法
console.log(div.dataset.listName)；
console.log(div.dataset['listName'])；