lovecoding
/
class


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738
							<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="ha">哈哈哈哈</div>
    <div class="news">新的内容</div>
    <h1>DOM:Document Object Model</h1>
    <div class="list">
        这是一个列表内容
    </div>
    <ul class="newList">
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>
    <script>
        // id选择器 document.getElementById 获取的标签元素
        var a1 = document.getElementById("ha");
        console.log(a1);
        // class选择器
        var a2 = document.getElementsByClassName("news");
        console.log(a2);
        // 标签选择器
        var a3 = document.getElementsByTagName("h1");
        console.log(a3);
        // 通过css样式名获取 获取的标签元素 querySelector
        var a4 = document.querySelector(".list");
        console.log(a4);
        // 通过css样式名获取 获取全部元素 querySelectorAll
        var uls = document.querySelectorAll(".newList li");
        console.log(uls);
    </script>
</body>
</html>