DOM初识

1.DOM结构：

DOM结构是以家族关系进行描述，一般描述的时候以父子兄弟描述就够了；

2.DOM元素的获取：

ID 选择器：性能最好的选择器
document.getElementById( 元素id );


标签选择器 : 获取到的是一个类数组，调用的时候需要用循环来调用
document.getElementsByTagName(“标签名”);


HTMLCollection 为了承载更多的元素
CSS 选择器/查询选择器：
document.querySelector(“选择器”);

3.DOM属性值获取

属性值一般存在 Key = “value”这种形式要想去除 value值需要用到
getAttribute(“需要查找的Key值”);

4.DOM向元素中添加内容

获取到这个元素之后该往元素中添加你想要的效果呢这就需要用到几个api
innerHTML:如果放入内容会直接被解析; 不会对标签进行特殊处理


innerText:如果放入的内容存在标签，那么这个标签会被转义;会对标签进行特殊处理；

outerHTML:最硬的插入内容的方式;直接改变标签内容；

5.改变样式

cls.style 专门用来更改元素样式的;
cssText : 会把赋值的内容直接放在行内样式的style之中;
cls.style.cssText = “bacground-color : red;”; 这样可以覆盖原有的css样式


两次 cssText 的设置只会保留后面设置，前面则不会保留;
使用cssText 一定要统一设置样式不要分批次设置样式;专门的工具，做专用的事;

最后根据这些知识可以做一个简单的表格隔行换色：