GetElementById获取元素
<div id="time">2021-12.17</div>
<script>
//得到一个元素通过id为time
var time1 = document.getElementById('time');
//打印获得的元素对象
console.log(time1);
//打印元素对象的类型
console.log(typeof time1);
//打印元素对象的类型，可以查看里面的属性和方法
console.dir(time1)
</script>
GetElementsByTagName()返回指定标签名的对象合集，以伪数组的形式存储
<ul>
<li>0</li>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
<script>
//得到对象通过标签名字li，返回的是元素对象的集合，以伪数组的形式存储
var lis = document.getElementsByTagName('li');
console.log(lis);
console.log(lis[2]);
//依次打印对象元素可以用遍历的方式
for (var i = 0; i < lis.length; i++) {
console.log(lis[i]);
}
//如果页面中只有一个li，返回的也是伪数组形式
//如果页面中没有li，返回一个空的伪数组
总结
<script>
var boxs = document.getElementsByClassName('box');
//返回指定选择器的第一个元素对象，注意选择器要加符号 .box #nav
var boxs = document.querySelector('.box');
var nav = document.querySelector('#nav');
var lis = document.querySelector('li');
//返回指定选择器的所有元素对象集合
var boxs = document.querySelectorAll('.box');
//返回body元素对象
document.body
//返回html元素对象
document.documentElement
</script>
获取元素属性值
获取自定义属性的值
