1、打开编辑工具editplus，点击editplus菜单栏上的【File】-->New -->HTML page。
2、新建好html页面后，editplus自动帮助我们生成了框架，先把title修改下，然后保存。
3、在body区域里添加了子，父，祖父三级div，代码如下。
4、演示代码写好后，打开浏览器，在浏览器上运行看看效果。
5、下面在head区域里添加实现js获取最高父级的代码，代码具体如下，这样利用了while循环来判断的。
6、实现好后，保存代码，此时再到浏览器上刷新访问，看下，此时弹出对话框告诉最后父级是zufu。
js找一个子元素的父元素：
<!DOCTYPE html><html><head>
<meta charset="utf-8">
</title> <script type="text/javascript"> function deleteElement(Obj)
{ Obj.parentNode.parentNode.removeChild(Obj.parentNode) } </script></head>
<body> <ul class="list2" ><li ><img alt="" src="1.jpg" /><div>mingzi1</div>
<a onclick="deleteElement(this)">删除</a></li><li ><img alt="" src="2.jpg" />
<div>mingzi2</div><a onclick="deleteElement(this)">删除</a></li><li >
<img alt="" src="3.jpg" /><div>mingzi3</div><a onclick="deleteElement(this)">删除</a>
</li></ul></body></html>
拓展资料删除一个父元素下面的所有子元素:
document.getElementById("ok").innerHTML = ""
删除其中的一个：
document.getElementById("ok").remove(document.getElementById("ok").children(i))
//删除id为"ok"下的第i-1个子元素
理解以下几点后就很清楚了：DOM是html 文档接口。
DOM将html文档的元素（即html标签）根据层级整理成树状模型。
而js操作html都是通过DOM来操作的。
一棵树，有干、有枝、有叶，叶的父级是枝，枝的父级是干。
如果你只是看文件的内容的话它是可以这样理解的：
中国 包含 云南，云南 包含 红河州， 红河州 包含 红河人hongheren.cn
红河州就是红河人 的父级，云南是红河州的父级，中国是云南的父级
例：<html><body><div></div></body></html>
body是div的父级，html是body的父级
其它一次类推。
以上是DOM父级的理解，有助于理解js事件的父级。
js事件的父级，说白了就是事件发生点的元素的对象的父级对象上的事件。
如下面的代码保存为html文件：
<html><body onclick="alert('body')"><div onclick="alert('div')"
style="width:600pxheight:400pxbackground-color:F00"></div></body></html>
用浏览器开打后你会发现点击div是body的onclick事件也被触发了。
如上，应该能够理解了吧。
