功能： querySelector() 方法返回文档中匹配指定 css 选择器的第一个元素；如果你需要返回所有的元素，请用 querySelectorAll() 方法替代；
语法： document.querySelector(CSS selectors)；
参数值： String 必须。指定一个或多个匹配元素的 CSS 选择器。使用它们的 id, 类, 类型, 属性, 属性值等来选取元素。
对于多个选择器，使用逗号隔开，返回一个匹配的元素。
返回值: 匹配指定 CSS 选择器的第一个元素。 如果没有找到，返回 null。如果指定了非法选择器则抛出 SYNTAX_ERR 异常。
<div class="box">第1行</div>
<div class="box">第2行</div>
<div class="box">第3行</div>
<script>
let box = document.querySelector(".box");
box.style.color = "red";
console.log(box);
let boxes = document.querySelectorAll(".box");
console.log(boxes);
for(let i = 0; i < boxes.length; i++)
console.log(boxes[i]);
</script>
getElement(s)Byxxxx 获取的是动态集合，querySelector 获取的是静态集合。
动态就是选出的元素会随文档改变，静态不会随文档改变，取出来之后就和文档的改变无关了。
<ul id="wrap">
<li>item1</li>
<li>item2</li>
<li>item3</li>
</ul>
<script>
let wrap = document.getElementById("wrap");
let li = document.getElementsByTagName("li");
for(let i = 0; i < 10; i++){
let newli = document.createElement("li");
newli.innerhtml = "item" + i;
wrap.AppendChild(newli);
}
console.log(li.length);
</script>
控制台输出13。
// let li = document.getElementsByTagName("li");
let li = document.querySelectorAll("li");
控制台输出3。
window.onload() 方法用于在网页加载完毕后立刻执行的操作，即当 HTML 文档加载完毕后，立刻执行某个方法。
window.onload() 通常用于 <body> 元素，在页面完全载入后（包括图片、css文件等等）执行脚本代码。
因为 JAVAScript 中的函数方法需要在 HTML 文档渲染完成后才可以使用，如果没有渲染完成，此时的 DOM 树是不完整的，这样在调用一些 JavaScript 代码时就可能报出"undefined"错误。
<a href="https://noi.hioier.com/" target="_blank">https://noi.hioier.com/</a>
<script>
window.onload = function(){
let obj = document.querySelector("a[target]");
console.log(obj);
obj.style.color = "red";
}
</script>
键盘事件就是按下、抬起按键所触发的事件，区分不同按键使用键码值，即ASCII值。
window.onload = function(){
let input = document.getElementById("txt");
input.onkeyup = function(e) {
let keyCode = e.keyCode;
if (keyCode >= 48 && keyCode <= 57) {
alert("啦啦，你按下的是数字键！");
} else {
alert("哈哈，你没有按下数字键哦！")
}
}
}
常见的触发函数有：
鼠标
键盘
表单
窗口：需要作用到window元素上。
window.addEventListener("keydown", function(e){
let keyCode = e.keyCode;
if (keyCode >= 48 && keyCode <= 57) {
alert("啦啦，你按下的是数字键！");
} else {
alert("哈哈，你没有按下数字键哦！")
}
});
京公网安备 11010802035086号