SOURCE

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 oParent = this.parentNode;
           
           //为父元素添加样式
            oParent.style.color="white";
            oParent.style.backgroundColor="lightskyblue";
        }
    }

    var oUl = document.getElementById("list");
    var oChildNodes = oUl.childNodes;
    var oChildElements = oUl.children;

    console.log(oChildNodes.length);
    console.log(oChildElements.length);

    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.lastElementChild);
        
        //删除兄弟元素节点
        //var preLastElement = oUl.lastElementChild.previousElementSibling;
        //oUl.removeChild(preLastElement);
        
        //删除兄弟节点
        var preLastNode = oUl.lastElementChild.previousElementSibling;
        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;
}