1.querySelector指定一个或多个匹配元素的 CSS 选择器。 可以使用它们的 id, 类, 类型, 属性, 属性值等来选取元素。对于多个选择器,使用逗号隔开,返回一个匹配的元素。
注意:querySelector() 方法仅仅返回匹配指定选择器的第一个元素。如果你需要返回所有的元素,请使用 querySelectorAll() 方法替代。
但是有区别:
例如:ID选择
getElementById: var btn =document.getElementById("btn");
querySelector: var btn =document.querySelector("#btn");
类选择
var btn =document.querySelector(".btn");
var btn =document. getElementsByClassName(“btn”);
2.classList 属性返回元素的类名,作为 DOMTokenList 对象
classList.length : class的长度
add() : 添加class方法
remove() : 删除class方法
toggle() : 切换class方法
下面通过刚学的做了个小练习-下拉列表
html5部分
css部分
js部分