Dom-修改
一、内容的修改
1.获取或者修改原始html的内容片段
elem.innerHTML 这是获取内容
elem.innerHTML="123456";这是修改内容为123456
elem.innerHTML后面带值就是修改，不带值就是获取
2.获取或者修改纯文本内容：
elem.textContent 可以翻译特殊符号为正文，去掉内嵌的子标签，只保留文字
3.表单元素的值
elem.value
二、属性的修改
1.html标准属性的修改
1)核心DOM API
获取属性值：var value=elem.getAttribute("属性名")；
修改属性值：elem=removeAttribute("属性名","新值");
移除属性值：elem.removeAttribute("属性名")；
判断是否包含属性：var bool=elem.hasAttribute("属性名")；
2)HTML DOM API(对常用核心DOM API的简化)
HTML DOM将所有的HTML标准属性定义在内存中的元素对象上
使用：elem.属性名
特例：class是ES的标准关键字
DOM中不允许使用class作为属性名
DOM中的className属性等于HTML中的class
2.状态属性的修改
状态属性有：enable disable selected checked
值都是bool类型，不是字符串类型，不能用核心DOM API修改
只能用HTML DOM中的.来访问
3.自定义扩展属性
自定义属性为自己定义的属性，不是系统中原有的属性
自定义扩展属性可以代替id，class选择器，HTML DOM无法访问自定义属性
自定义扩展属性的定义方法：<任何标签 自定义属性名=“值”>
HTML5标准中的定义：<任何标签 自定义属性名=“值”>
自定义属性的修改和获取
1.核心DOM API对自定义属性的操作
.getAttribute()//获取属性
.setAttribute()//获取属性
.removeAttribute()//移除属性
.hasAttribute()//判断属性的存在
注意：HTML DOM API不能操作自定义属性，由于自定义属性不是一开始就存在于HTML标准，则没有包含在元素树中，不能直接访问
2.HTML5标准中对自定义属性的操作
elem.dataset//可自动获取所有的data-开头的属性
.自定义属性名称//使用dataset访问自定义属性时，不用data-前缀
三、样式的修改
1.内联样式的修改
elem.style.css属性名=“值“ <=> <elem style="css属性名：值">
注意：1.css属性名中如果带-，需要去掉横线变驼峰
z-index=>zIndex
list-style=>listStyle
background-color=>backgroundColor
2.如果是带px、em等单位的属性值，
修改时：必须手动拼接到结尾 .style.width=12+"px"
获取时：不许去掉结尾的px、em，才能做计算
elem.style仅代表内联样式
修改时：如果elem.style 优先级最高
获取时：只能获取内联样式，无法获取外部样式中的样式
获取样式：不能用style
应该获取计算后的样式：最终应用到元素上的所有样式的集合
获取样式的步骤：
1.先获取计算后的样式的集合对象：
var style=getComputedStyle(elem)
2.获取一个css属性的值
style.css属性
注意：应为计算后的样式属性来源不确定，所以都是只读的
问题：elem.style修改样式，一句话只能修改一个属性
解决：今后只要修改大量的css属性，首选修改class的修改方式
2.内外部样式表的修改
var sheet=document.styleSheets[i];
var rule=sheet.cssRules[i]
rule.style.样式属性=值
3.最好的修改样式的方法
修改class属性，批量修改样式。
