h5新增获取元素的方式

 <div class="box">盒子1</div>
    <div class="box">盒子2</div>
    <div id="nav">
        <ul>
            <li>首页</li>
            <li>产品</li>
        </ul>
    </div>

    <script>
        // 1、根据类名获得某些元素的对象集合,不需要加点
        var boxs=document.getElementsByClassName('box');
        console.log( boxs);//HTMLCollection(2)
        console.log(boxs[1]);//<div class="box">盒子</div>

        // 2、querySelector()返回指定选择器的第一个元素对象 
        // 切记 里面的选择器需要加符号 .box #nav
        var firstBox=document.querySelector('.box');
        console.log(firstBox);
        //firstBox=[object HTMLDivElement]==<div class="box">盒子</div>

        var allBox=document.querySelectorAll('.box');
        console.log(allBox);//NodeList(2) [div.box, div.box]
        
        var alllis=document.querySelectorAll('li');
        console.log(alllis);//NodeList(2) [li, li]
    </script>