比如现在我们可以结合事件，来进行密码长度的校验，密码长度小于6则不合法，不合法的密码，会让密码框边框变红，那么首先我们先来编写一个css样式：
.illegal-pwd{ border: red 1px solid !important; box-shadow: 0 0 5px red; }接着我们来编写一下js代码，定义一个函数，此函数接受一个参数（元素本身的对象）检测输入的长度是否大于6，否则就将当前元素的class属性设定为css指定的class：
function checkIllegal(e) { if(e.value.length < 6) { e.setAttribute("class", "illegal-pwd") }else { e.removeAttribute("class") } }最后我们将此函数绑定到oninput事件即可，注意传入了一个this，这里的this代表的是输入框元素本身：
<input oninput="checkIllegal(this)" type="password">现在我们在输入的时候，会自动检查密码是否合法。
既然oninput本身也是一个属性，那么实际上我们可以动态进行修改：
document.getElementById("pwd").oninput = () => console.info("???")那么，我们前面提及的window对象又是什么东西呢？
实际上Window对象范围更加广阔，它甚至直接代表了整个窗口，当然也包含我们的Document对象，我们一般通过Window对象来弹出提示框之类的东西。
发送XHR请求JS的大致内容我们已经全部学习完成了，那么如何使用JS与后端进行交互呢？
我们知道，如果我们需要提交表单，那么我们就需要将表单的信息全部发送给我们的服务器，那么，如何发送给服务器呢？
通过使用XMLHttpRequest对象，来向服务器发送一个HTTP请求，下面是一个最简单的请求格式：
let xhr = new XMLHttpRequest(); xhr.open(\'GET\', \'https://www.baidu.com\'); xhr.send();上面的例子中，我们向服务器发起了一次网络请求，但是我们请求的是百度的服务器，并且此请求的方法为GET请求。
我们现在将其绑定到一个按钮上作为事件触发：
function http() { let xhr = new XMLHttpRequest(); xhr.open(\'GET\', \'https://www.baidu.com\'); xhr.send(); } <input type="button">我们可以在网络中查看我们发起的HTTP请求并且查看请求的响应结果，比如上面的请求，会返回百度这个页面的全部HTML代码。
实际上，我们的浏览器在我们输入网址后，也会向对应网站的服务器发起一次HTTP的GET请求。
在浏览器得到页面响应后，会加载当前页面，如果当前页面还引用了其他资源文件，那么会继续向服务器发起请求，直到页面中所有的资源文件全部加载完成后，才会停止。