本节 JavaScript 的 DOM 操作，内容主要包括：通过* ID、名字、标签名选取元素*； *通过 getAttribute 和 setAttribute 获取和设置元素属性；* *通过 parentNode 获取父元素、createElement 动态地创建节点、appendChild 和removeChild 动态地添加或者删除节点。*![实验楼](https://dn-simplecloud.shiyanlou.com/3735341489904220610-wm) 我们可以使用方法 getElementByID() 通过元素的 ID 而选取元素，并对其做操作，比如：通过 getElementByID() 设置了 ID 为 my_div 的一个 div 标签的高度（100px）和颜色（red），除了通过 ID 选择元素，我们还可以使用 getElementByName() 方法或者 getElementsByTagName() 方法找到元素，不过如果有多个同类型标签，那我们需要以下标来确认：![实验楼](https://dn-simplecloud.shiyanlou.com/3735341489904540739-wm) 使用getelementstagname和使用byname之间的区别，使用前者是使用一个标签来确定，如果有多个标签，则会自动将标签放入一个数组之中。按照顺序来访问。数组中存储标签是按照写的先后顺序存放的。可以通过 getAttribute() 和 setAttribute() 查询和设置元素的属性：![实验楼](https://dn-simplecloud.shiyanlou.com/3735341489905364959-wm) 在了解 JavaScript 之前，可能会以为一个 HTML 页面被写出来是什么样，那它就固定了是什么样子。但是 JavaScript 可以动态地在页面中创建并插入节点，这便需要用到 createElement()、appendChild() 方法，它们的作用分别是创建节点和插入节点。比如：创建一个 div 并为其设置高度（100px）和背景色（red），并追加到 body 后面：除了创建，我们还可以删除一个节点，通过 removeChild() 方法：

function remove_red(){ var obj = document.getElementById("div_red"); obj.parentNode.removeChild(obj); } 但是 JavaScript 可以动态地在页面中创建并插入节点，这便需要用到 createElement()、appendChild() 方法，它们的作用分别是创建节点和插入节点。创建一个 div 并为其设置高度（100px）和背景色（red），并追加到 body 后面：

“Javascript基础（新版）”实验报告