获取元素简单分为以下几种
- 根据ID获取元素
- 根据标签名获取元素
- 根据类名获取元素
- 根据指定选择器获取元素
- 获取特殊的元素
根据ID获取元素:document.getElementById('');
通过Id成功拿到该元素,返回的是一个元素对象。
根据标签获取元素:document.getElementsByTagName('');
它返回的是带有指定标签名的对象集合,是个伪数组,所以想要操作里面的元素,需要遍历。
注意点:
- 因为是复数,所以方法中元素单词是复数有s;
- 如果页面中没有这个元素,返回的是空的伪数组的形式;
- 如果页面中只有一个li,返回的还是伪数组形式;
根据类名获取元素:document.getElementsByClassName('');
H5新增方法,返回元素对象的集合,也是伪数组。
根据指定选择器获取:document.querySelector(''); document.querySelectorAll('');
通过CSS选择器(类名、Id)获取元素,H5新增。如果通过类名或Id方式获取,前面要加选择器符号‘.’‘#’
querySeleor: 返回指定选择器的第一个元素对象,如有多个只取第一个。 querySelorAll: 返回指定选择器的所有元素对象集合,伪数组形式。
获取特殊元素:body元素、html元素
document.body; 返回body元素对象。
document.html; 返回html元素对象
说到这里,顺便提一个除了log之外的另一个打印方法:console.dir()它可以打印我们返回的元素对象,更完全的查看里面含有的属性和方法,超赞!
在学习的过程中我觉得梳理和总结知识尤为重要,能让我们的知识更扎实,走得更远。
end...