console 命令行工具 X clear

console

window.onload=function(){
//找到所有的td元素
var oTds=document.getElementsByTagName("td");

//循环遍历表格,点到任何一个单元格都变颜色（给每一个td元素添加点击事件）
for(var i=0;i<oTds.length;++i){
    oTds[i].onclick=function(){
        //获取当前的td父元素tr
        var oPrarent=this.parentNode;
        oPrarent.style=color="white";
        oPrarent.style.backgroundColor="lightskyblue";
    }
}
var oUl=document.getElementById("list");
var oChildNodes=oUl.childNodes;
var oChildElements=oUl.children;

console.log("There are"+oChildNodes.length+"child nodes in list");
console.log("There are"+oChildElements.length+"child elements in list");

var oBtn=document.getElementById("btn");

oBtn.onclick=function(){
    //删除最后一个子节点
    //oUl.removeChild(oUl.lastChild);

    //删除最后的元素节点
   /*if(oUl.lastChild.nodeType==3){
        oUl.removeChild(oUl.lastChild);
         oUl.removeChild(oUl.lastChild);
    }
    else{
        oUl.removeChild(oUl.lastChild);
    }
    oUl.removeChild(oUl.lastElements);

    //删除兄弟节点
    var preLastElement=oUl.lastElementChild.previousElementSibling;
    oUl.removeChild(preLastElement);*/

    //删除兄弟节点
    var preLastNode=oUl.lastElementChild.previousSibling;
    oUl.removeChild(preLastNode);
}

}

<!DOCTYPE html> 
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <style type="text/css">
        
    </style>
    <script>
       
    </script>
</head>
<body>
    <table>
        <caption>考试成绩表</caption>
        <tr>
            <td>小明</td>
            <td>80</td>
            <td>80</td>
            <td>80</td>
        </tr>
        <tr>
            <td>小红</td>
            <td>90</td>
            <td>90</td>
            <td>90</td>
        </tr>
        <tr>
            <td>小杰</td>
            <td>100</td>
            <td>100</td>
            <td>100</td>
        </tr>
    </table>

    <ul id="list">
        <li>HTML</li>
        <li>CSS</li>
        <li>JavaScript</li>
        <li>jQuery</li>
        <li>Vue.js</li>
    </ul>
    <button id="btn">删除</button>
</body>
</html>

//把合并
table{
    border-collapse: collapse;
}
table,tr,td{
    border:1px solid gray;
}