JavaScript-事件和事件对象、实现键盘打字小游戏

};

mouseover：当鼠标移到某个元素上方时触发。

input.onmouseover = function () {

alert(‘Mumu’);

};

mouseout：当鼠标移出某个元素上方时触发。

input.onmouseout = function () {

alert(‘Mumu’);

};

mousemove：当鼠标指针在元素上移动时触发。

input.onmousemove = function () {

alert(‘Mumu’);

};

2.键盘事件

keydown：当用户按下键盘上任意键触发，如果按住不放，会重复触发。

onkeydown = function () {

alert(‘Mumu’);

};

keypress：当用户按下键盘上的字符键触发，如果按住不放，会重复触发。

onkeypress = function () {

alert(‘Mumu’);

};

keyup：当用户释放键盘上的键触发。

onkeyup = function () {

alert(‘Mumu’);

};

3.HTML事件

load：当页面完全加载后在window上面触发，或当框架集加载完毕后在框架集上触发。

window.onload = function () {

alert(‘Mumu’);

};

unload：当页面完全卸载后在window上面触发，或当框架集卸载后在框架集上触发。

window.onunload = function () {

alert(‘Mumu’);

};

select：当用户选择文本框(input或textarea)中的一个或多个字符触发。

input.onselect = function () {

alert(‘Mumu’);

};

change：当文本框(input或textarea)内容改变且失去焦点后触发。

input.onchange = function () {

alert(‘Mumu’);

};

focus：当页面或者元素获得焦点时在window及相关元素上面触发。

input.onfocus = function () {

alert(‘Mumu’);

};

blur：当页面或元素失去焦点时在window及相关元素上触发。

input.onblur = function () {

alert(‘Mumu’);

};

submit：当用户点击提交按钮在元素上触发。

form.onsubmit = function () {

alert(‘Mumu’);

};

reset：当用户点击重置按钮在元素上触发。

form.οnreset= function () {

alert(‘Mumu’);

};

resize：当窗口或框架的大小变化时在window或框架上触发。

window.onresize = function () {

alert(‘Mumu’);

};

scroll：当用户滚动带滚动条的元素时触发。

window.onscroll = function () {

alert(‘Mumu’);

};

var input = document.querySelector(“input”);

var showcode = document.createElement(“div”);

showcode.style.width = “200px”;

showcode.style.height = “200px”;

showcode.style.backdroundColor = ‘rgba(0,0,0,0.6)’;

showcode.style.position = “fixed”;

showcode.style.left = “200px”;

showcode.style.top = “200px”;

document.body.appendChild(showcode);

input.onkeydown =function(event){

showcode.innerHTML=event.key;

}

二、实现打字小游戏

开始

tanchuang.css

• {

文末

js前端的重头戏，值得花大部分时间学习。

推荐通过书籍学习，《 JavaScript 高级程序设计（第 4 版）》你值得拥有。整本书内容质量都很高，尤其是前十章语言基础部分，建议多读几遍。

另外，大推一个网上教程 现代 JavaScript 教程 ，文章深入浅出，很容易理解，上面的内容几乎都是重点，而且充分发挥了网上教程的时效性和资料链接。

学习资料在精不在多，二者结合，定能构建你的 JavaScript 知识体系。

面试本质也是考试，面试题就起到很好的考纲作用。想要取得优秀的面试成绩，刷面试题是必须的，除非你样样精通。

这是288页的前端面试题