abstrak：<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
.move{widt
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
.move{width: 100px;height: 100px;background: red;}
</style>
<script src="jquery-3.3.1.min.js"></script>
<script>
$(document).ready(function(){ //文檔就緒函數開始
// ----------------------------------------------------------------
// 事件函數：窗口發(fā)生大小變化或調整后發(fā)生的函數resize
// a = 1;
// //這是一個window方法，連接上resize函數事件，操作瀏覽器了所以叫window方法
// $(window).resize(function(){
// // 聲明獲取b標簽把b標簽的內容插入a的值，a用戶計算用戶亂動顯示器的行為！
// $('b').text(a++)
// alert('親，不要亂動顯示器')
// })
// ----------------------------------------------------------------
// 鼠標事件mouseove： 獲取鼠標移動事件 獲取坐標值：pageX() pageY()
// $(document).mousemove(function(aa){
// // 獲得x值加上y值坐標的結果插入到css屬性
// $('.coord').text('x:'+aa.pageX+'y:'+aa.pageY);
// })
// coord：坐標
//-----------------------------------------------------------------
//雙擊事件 dbclick()
// 第一句語法和別的不太一樣，是直接先獲取元素，然后連接雙擊事件函數
// $('.move').dbclick(function(){
// // this是指向函數綁定的DOM元素本身
// $(this).css('background','blue')
// })
//-----------------------------------------------------------------
// 點擊事件 click
// $('button').click(function(){
// $('#box').css('background','yellow')
// })
//-----------------------------------------------------------------
// focus() 當元素獲取到焦點
// $('.input1').focus(function(){
// $('.input1').css('background','pink')
// })
//-----------------------------------------------------------------
// blur() 當元素失去焦點 例如：用戶離開了input框執(zhí)行此函數方法改變背景紅色
// $('.input2').blur(function(){
// $('.input2').css('background','blue')
// })
//-----------------------------------------------------------------
}) //文檔就緒函數 結束
</script>
</head>
<body>
當前坐標<span></span>
<input type="" name="">
<p>正在計算您已經調整窗口<b></b>次</p>
<div></div>
<div id="box"></div>
<button>變色</button>
<br>
<input>
<br>
<span>鼠標離開文本框變藍</span><input>
<br>
</body>
</html>
