1. 获取父节点 - parentNode
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JS</title>
</head>
<body>
<div>
<button class="btn">按钮</button>
<span id="span">
<a href="#">百度一下</a>
</span>
</div>
<script type="text/javascript">window.onload = function() {
var a = document.getElementsByTagName("a")[0];
var parentNode = a.parentNode.parentNode;
console.log(parentNode);
}
</script>
</body>
</html>2. 小例子：
2.1 通过子盒子设置父盒子的背景颜色
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JS</title>
<style>
#box {
width: 200px;
height: 200px;
}
</style>
</head>
<body>
<div id="box">
<button class="btn">按钮</button>
<span id="span">
<a href="#">百度一下</a>
</span>
</div>
<script type="text/javascript">
window.onload = function() {
var btn = document.getElementsByClassName("btn")[0];
btn.onclick = function() {
var span = document.getElementById("span");
var box = span.parentNode;
box.style.backgroundColor = "red";
};
}
</script>
</body>
</html>