通过id来获取dom节点
document.getElementById⽅法返回匹配指定id属性的元素节点。如果没有发现匹配的节点,则返回null
通过标签名获取dom节点
document.getElementsByTagName⽅法搜索 HTML 标签名,返回符合条件的元素集合
通过class类名获取dom节点
document.getElementsByClassName⽅法返回包括了所有class名字符合指定条件的元素集合
获取父元素的子节点
获得第一个子节点
语法:document.getElementById(“test”).firstElementChild;
document.getElementById(“test”).firstChild;
获得最后一个子节点
语法:document.getElementById(“test”).lastElementChild;;
document.getElementById(“test”).lastChild;
<body>
<div id="father">
<h1>标题1</h1>
<p id="p1">p1</p>
<p class="p2">p2</p>
</div>
</body>
<script>//对应CSS选择器
//通过标签名,获取节点
var h1 = document.getElementsByTagName("h1");
//通过ID获取节点
var p1 = document.getElementById("p1");
var father = document.getElementById('father');
//通过ClassName类获取节点
var p2 = document.getElementsByClassName("p2");
var chiledrens=father.children;//获取父节点下面所有的子节点
//father.firstChild
//father.lastChild
</script>
</html>