DOM(文档对象模型（Docunment Object Model ）)
标签 元素 节点 某种意义上是一个意思。语境不同，叫法不同。
<style>
#d1{100px;height:100px;}
</style>
<body>
<div id="d1"></div>
<div class="d2"></div>
<span></span>
</body>
<script>
Id选择器
var d1 = document.getElementById("d1") Id选择器 括号内为字符串形式加双引号 获取id为d1的元素
d1.innerHTML ="123456";
d1.style="color:red;font-size:50px;" 修改样式 d1中的文字变色 字体变大
d1.style.color="red";
alert(d1.style.width); 只能获取标签里的样式，css中d1的样式无法获取
Class选择器
var d2 =document.getElementsByClassname("d2"）[0]； Class选择器
d2.innerHTML="ABCDEF";
标签选择器
var d3 = document.geiElementsByTagName("span"); 标签选择器 Tag位标签
d3,innerHTML="xyzijk ";
</scripr>
修改内容
innerHIML和innerText区别 改内容 在内容中加<br/>(折行符)在HTML中会读出来换行在Text不会换行直接在网页中显示<br/>;
方法
<body>
<input id="btn" type="button" value="按钮"/>
<select>
<option select="select">1</option> select 默认被选中
<option>2</option>
<option>3</option>
</select>
<input type="radio" checked="checked"/> 单选标签
<input type="checkbox" checked="checked"/> 多选标签
<div id="d1" style="position:fixed;right:0px;bottom:0px;100px;height:100px;"><div>
</body>
<script>
var btn = document.getElementById("btn");
btn.onclick=funtion(){ 点击btn发生事件
btn.setAttribute("value""不是按钮") 设置btn的属性括号内放两个参数第一个参数为属性名字 第二个参数属性的值
btn.getAttribute("value") 获取属性
btn.removeAttribute() 移除属性
}
造标签
create 创造
var spn=dcument.createElement("span"); 创造一个span元素（标签）
spn.style.colot="red";
spn.innerText="滋滋滋滋"；
append 增加
document.body.appendChild(spn); append 增加 Child 子标签 文档对象的去除body在body中添加一个子元素子元素是spn
document.getElementById("d1").appendChild(spn); 从div中添加spn
删除元素
removeChild
document.getElementById("d1")removeChid(spn); 删除d1中的spn
</script>