- 博客(25)
- 收藏
- 关注
RSS订阅原创 Ajax - 服务器响应JSON数据
代码:<div id="result"></div> <script> const result = document.getElementById('result'); // 绑定键盘按下事件 window.onkeydown = function(){ // 向服务端发送请求 const xhr = new XMLHttpRequest(); // 设置响应体数据的类型
2022-04-22 15:00:20
153
原创 AJAX POST 请求
代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&
2022-04-22 14:18:17
340
原创 AJAX GET 请求
代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&
2022-04-22 13:44:48
172
原创 手写Promise串行
Promise串行是指每一个由promise封装的任务都顺序执行，即上一个执行完成后再执行下一个。日常开发中会经常用到Promise串行。
2022-04-12 15:20:30
292
原创 jQuery实例
1.新浪下拉菜单（核心代码）<body> <ul class="nav"> <li> <a href="#">微博</a> <ul> <li><a href="#">私信</a></li> <li><a href="#">评论
2022-02-24 15:02:21
213
原创 淘宝 flexible.js 源码分析
触发load事件的三种情况：1.a标签的超链接2.F5或者刷新按钮（强制刷新）3.前进后退按钮(function flexible(window, document) { // 获取的html 的根元素 var docEl = document.documentElement // dpr 物理像素比 // 看当前浏览器的物理像素比，能拿到显示物理像素比，找不到当1看 var dpr = window.devicePixelRatio
2022-02-23 15:07:38
152
原创 弹出框（模态框）拖拽
点击弹出层，会弹出模态框，且显示灰色半透明的遮挡层。点击关闭按钮，可以关闭弹出框，且灰色半透明遮挡层关闭。按住鼠标拖拽弹出框在页面中移动。可以停止拖动弹出框移动。（① 弹出框和遮挡层就会显示出来 display:block;② 弹出框和遮挡层就会隐藏起来 display:none;③ 在页面中拖拽的原理： 鼠标按下并且移动， 之后松开鼠标④ 触发事件是鼠标按下 mousedown， 鼠标移动mousemove 鼠标松开 mouseup⑤ 拖拽过程: 鼠标移动过程中，获得最新的值赋
2022-02-22 15:39:09
1026
原创 BOM对象案例
1.5秒钟之后自动跳转页面（利用定时器做倒计时效果；使用location.href实现页面跳转，封装函数并调用函数防止第一次刷新页面有空白。）<div></div> <script> var div = document.querySelector('div'); var timer = 5; coun(); setInterval(coun,1000); function
2022-02-22 14:31:46
152
原创 定时器案例
1.5秒后自动关闭的广告<img src="img/113.jpeg" alt="" class="ad"> <script> var ad = document.querySelector('.ad'); setTimeout(function() { ad.style.display = 'none'; }, 5000); </script>2.倒计时（倒计时是不断变
2022-02-21 17:24:59
284
原创 键盘事件案例
1.模拟京东按键输入内容（当按下s键，光标会定位到搜索框）（思路：检测用户是否按下s键，如果按下s键，就把光标定位到搜索框里。使用键盘事件对象里面的keyCode判断用户按下的是否为s键；使用js里面的focus（）方法使搜索框获得焦点）<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="w
2022-02-21 13:05:43
195
原创 节点操作案例
1.下拉菜单（仿微博）<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &l
2022-02-18 17:03:08
149
原创 tab栏切换（重点案例）
仿京东tab切换栏（鼠标点击相应的选型卡，下面内容会跟随变化）（利用排他思想）<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, i
2022-02-16 10:15:09
375
1
原创 DOM实例2
1.显示隐藏文本框内容（当鼠标点击文本框时，里面的默认文字隐藏，当鼠标离开文本框时，里面的文字显示）（仿京东）<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width
2022-02-15 15:08:18
320
原创 DOM实例1
1.循环精灵图背景（精灵图一般会被提前设计好）（仿淘宝）（利用for循环设置一组元素的精灵图背景）<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=devic
2022-02-14 17:16:10
48
原创 js对象练习
1.猜数字游戏。要求用户猜1~50之间的一个数字，但是只有5次机会。function countDown(time){ var nowTime = +new Date(); //返回的是当前时间总的毫秒数 var inputTime = +new Date(time); //返回的是用户输入时间总的毫秒数 var times = (inputTime = nowTime)/1000; //time是剩余时间总的秒数 va
2022-02-14 15:43:22
2006
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人