Ajax:跨域、防抖和节流、HTTP协议
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="jquery.js"></script>
<style>
img {
position: absolute;
}
</style>
</head>
<body>
<img src="angel.gif" alt="">
<script>
// 1.设置节流阀
var timer = null
// 2.事件内部,判断timer,如果不为null(说明有一个定时器正在执行),return
$(document).on('mousemove', function (e) {
if (timer != null) {
return
}
// 3.设置定时器,定时器内部,编写程序代码.并且打开节流阀 (timer = null)
timer = setTimeout(function () {
var x = e.pageX // 鼠标距离页面左边的位置
var y = e.pageY // 鼠标距离页面上边的位置
// 设置img的位置
$('img').css({ left: x + 'px', top: y + 'px' })
console.log('今天星期三')
// 重置timer为null,相当于打开节流阀
timer = null
}, 30)
})
</script>
</body>
</html>