操作js中的dom

首先定义定义一个html页面，创建几个节点：

标题一

段落一

段落二

然后获取对应的节点信息：

接下来在定义一个html页面：

我们先获取此div节点：

var id1 = document.getElementById('id1');

可以对这个节点的文本进行操作，值得注意的是innerHTML可以解析html样式，但是innerText不可以

id1.innerText = '124';
id1.innerHTML = '124';

可以对这个节点的css样式进行操作：

id1.style.color = 'red';
id1.style.fontSize = '200px';
id1.style.padding = '2em';

接下来我们来测试下删除节点操作，还是用上面的html

标题一

段落一

段落二

注意：删除dom树节点是先要获得需要删除节点的父节点，然后才能删除对应的dom节点信息，如下所示

var self = document.getElementById('p1');
var father = self.parentElement;
father.removeChild(self);

要注意的一个点就是，删除dom接点是一个动态的过程，以上面的例子为例，比如删除了h1节点，那么p1节点就变成了第一个节点了

father.removeChild(father.children[0]);