DOM
-
DOM基本介绍：文档对象模型
-
doucment 对象 (一种树结构的文档)
- dom对象.innerText//获取文本
- dom对象.iinnerHTML//获取所有东西
- 获取复选框用getElementsByName,dom对象是集合，需要遍历
- 通过点击按钮更改图片，获取dom对象 用getElementByTagName,dom对象[i].src=""
- 创建一只伍六七案例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>创建小猫案例</title>
<script>
function addimg() {
//1,拿到对象
var zhe = document.createElement("img");//里面你想添加什么类型就写什么类型，html,img等等
zhe.src = "wallhaven-p9op59.jpg";
zhe.width = "100";
//展示,添加到document.body，总不能在外面展示吧，需要到body里面展示
document.body.appendChild(zhe);
}
</script>
</head>
<body>
<input type="button" onclick="addimg()" value="创建一只伍六七">
</body>
</html>
dom编程核心：拿到+操作，属性和方法查文档
- a.节点常用的方法
- b. 节点常用属性
- id-->getElementById()
-
name-->getElementsByname()
-
元素标签名-->
-
获取指定dom对象下的子节点
1）获取某个节点var zhe = document.getElementById("zhezi").getElement.getElementsByTagName("li");//获取id为zhezi下面的所有li元素
2）获取指定dom对象下的所有节点
var zhe = document.getElementById("zhezi").chileNodes;
for(var i = 0; i < zhe.length;i++)//遍历
3）本身就有集合的特点获取的是object text 和object html(如果不希望得到text对象，需要将所有的内容放在一行)
4）获取第一个节点
5)获取父节点zhe.parentNode
6)获取兄弟节点
前一个节点: zhe.previousSibling
后一个节点：zhe.nextSibling
css小复习：postion:abslote 绝对定位 针对原点定位 left距离窗口原点的横坐标 top距离窗口原点的纵坐标
