提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档
文章目录
提示：以下是本篇文章正文内容，下面案例可供参考
一、通过关系获取元素
1、查找父元素节点（返回元素节点，可以进行链式调用）
box.parentElement //body
console.log（box.parentElement.parentElement）;//html
2、父节点
box.parentNode
console.log（box.parentNode.parentNode）;
3、子元素节点
box.children
console.log（box.children[0].parentNode[0]）;//[0]才是节点
4、子节点
box.childNodes //3个：文本节点、标签节点，文本节点；其中，要是有注释也是一个注释标签
5、下一个兄弟元素节点
box.nextElementSibling
console.log(box.nextElementSibling.nextElementSibling);
6、下一个兄弟节点
box.nextSibling
7、上一个兄弟元素节点
box.proviousElementSibling //h3标签
6、上一个兄弟节点
box.proviousSibling //h3到div中间：文本节点
8、获取第一个子元素节点
box.firstElementChild //span标签
9、获取第一个子节点
box.firstChild //我是div：文本节点
10、获取最后一个元素节点
box.lastElementChild //注释标签
11、获取最后一个节点
box.lastChild //注释标签到div标签的：文本节点
二、表格点击事件
1.点击哪行哪行变色
代码如下（示例）：
let rows=document.querySelectorAll("tr");
for(let i=0;i<rows.length;i++){
//偶数行显示
if(i%2==0){
rows[i].style.backgroundColor="pink";
}
//设置点击功能
rows[i].onclick=function(){
//排他
for(let j=0;j<rows.length;j++){
rows[i].style.backgroundColor="white";
}
//设置自己
rows[i].style.backgroundColor="pink";
}
}2、让表格的偶数列显色
代码如下：
let trs=document.querySelectorAll("tr");
for(let i=0;i<trs.length;i++){
let tds=trs[i].children;//选择每一行里面的单元格
//偶数列显色
for(let j=0;j<tds.length;j++){
if(j%2==0){
tds[j].style.backgroundColor="pink";
}
}
}总结
排他设计思想：排除他人（包括自己），在单独设计自己