JavaScript思维导图——Day 17(事件类型，随鼠标移动的小红块，游戏用keydown)

今天药忘吃喽~ 2023-07-07 12:54 5阅读 0赞

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTE3NDIwOA_size_16_color_FFFFFF_t_70]

<!DOCTYPE html>
    <html>
    <head>
    	<title></title>
    	<style type="text/css">
    		input{
    			border: 1px solid aque;
    		}
    	</style>
    </head>
    <body>
    	
    	<input type="text" value='请输入用户名' style="color: #999" onfocus="if (this.value == '请输入用户名') {this.value = '';this.style.color = '#424242'}" onblur="if (this.value == '') {this.value = '请输入用户名';this.style.color = '#999'}">
    	<script type="text/javascript">
    
    		window.onload = function () {
    			var div = document.getElementsByClassName('qaq')[0];
    			console.log(div);
    		}
    		偷密码
    		// var div = document.getElementsByTagName('div')[0];
    		// window.onscroll = function () {
    		// 	console.log(window.pageXOffset + ' ' + window.pageYOffset)
    		// }
    		// var input = document.getElementsByTagName('input')[0];
    
    		// input.onchange = function (e) {
    		// 	console.log(this.value);
    		// }
    
    		// div.onmouseover = function () {
    		// 	div.style.background = "yellow";
    		// }
    		// div.onmouseout = function() {
    		// 	div.style.background = "green";
    		// }
    
    		// var firstTime = 0,
    		//     lastTime = 0,
    		//     key = false;
    
    		// document.onkeydown = function (e) {
    		// 	console.log(e);
    
    		// }
    		
    		// document.onkeypress = function (e) {
    		// 		console.log(String.fromCharCode(e.charCode));
    	
    		// }
    
    		// var disX,
    		//     disY;
    		
    
    		// div.onmousedown = function (e) {
    
    		// 	disX = e.pageX - parseInt(div.style.left);
    		// 	disY = e.pageY - parseInt(div.style.top);
    
    		// 	document.onmousemove = function (e) {
    		// 	var event = e || window.event;
    		// 	// console.log(e.pageX + "" + e.pageY);
    		// 	div.style.left = e.pageX - disX + "px";
    		// 	div.style.top = e.pageY - disY + "px";
    		//  }
    
    		//  document.onmouseup = function () {
    		//  	document.onmousemove = null;
    		//  }
    		// }
    	</script>
    	<div class="qaq"></div>
    
    </body>
    </html>

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTE3NDIwOA_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200223211956692.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTE3NDIwOA==,size_16,color_FFFFFF,t_70