![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
javascript
相信光的奥特王小懒
为未来而奋斗,为美好生活而拼搏。
展开
-
JavaScript的学习与实践
1. 函数的学习案例:通过函数调用来判断2月的天数<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=ed原创 2022-05-24 09:27:51 · 483 阅读 · 38 评论 -
发送验证码60s的时间限制
例如:哔哩哔哩网站上每次登录有一个验证码输入,且每次发送时间为60s的限制<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" ..原创 2021-09-06 09:24:37 · 388 阅读 · 0 评论 -
JavaScript中的Window常见对象(BOM)
1. 窗口加载事件使用上边的等式只能写一个,否则会按最后一个为标准;使用下边的等式可以写多个,所有的都不守影响。2. 调整窗口大小事件注意:常用于浏览器调整大小时,网页的页面内容显示。例如:京东页面全部展开为4列,缩小页面后从4列开始逐一隐藏。window.innerWitdh用于获取当前屏幕宽度。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> &原创 2021-09-05 17:53:24 · 175 阅读 · 0 评论 -
模拟京东快递单号查询
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>...原创 2021-09-05 16:30:03 · 480 阅读 · 0 评论 -
模拟京东按键输入案例(无论光标在什么位置,按s键即可将光标定位到搜索框)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>..原创 2021-09-05 16:13:24 · 614 阅读 · 0 评论 -
获得鼠标坐标的方式以及相关的鼠标天使移动案例
鼠标坐标获取<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <tit.原创 2021-09-05 15:43:57 · 188 阅读 · 0 评论 -
动态生成表格
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>...原创 2021-09-02 17:34:00 · 162 阅读 · 0 评论 -
新浪微博下拉菜单案例
鼠标经过的时候,下拉内容显示;鼠标离开的时候,下拉内容隐藏。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content=.原创 2021-09-02 16:19:58 · 1866 阅读 · 2 评论 -
tab栏切换制作(点击那一栏显示那一栏的内容,其他栏的内容隐藏)
<style> * { margin: 0; padding: 0; } li { list-style-type: none; } .tab { width: 978px; margin: 100px auto; } ...原创 2021-09-02 10:52:57 · 281 阅读 · 0 评论 -
表单全选以及取消全选的制作
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> * { padding: 0; margin: 0; } .wrap { width:..原创 2021-09-02 10:08:23 · 176 阅读 · 0 评论 -
JavaScript制作表格隔行变色效果(新浪微博中的应用)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>..原创 2021-09-02 09:55:53 · 440 阅读 · 0 评论 -
JavaScript实现百度换肤效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title&g...原创 2021-09-02 09:38:23 · 718 阅读 · 0 评论 -
密码框验证信息的案例
默认错误<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <...原创 2021-09-01 16:27:28 · 342 阅读 · 0 评论 -
网页中显示隐藏文本框内容
关于文本框的一些简单操作获得焦点的时候,text的value默认为空,然后输入我们想要的值;失去焦点的时候再显示原来的value值。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta.原创 2021-09-01 16:00:25 · 575 阅读 · 0 评论 -
购物页面点叉号二维码隐藏的做法
隐藏此二维码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <ti.原创 2021-09-01 15:27:56 · 483 阅读 · 0 评论 -
JavaScript中的Dom
1. 获取页面元素1.1 根据ID获取页面元素console.dir(id名) 可以帮助我们更好的查看里面的属性和方法注意:返回的是元素对象1.2 根据标签名获取返回的对象的集合,以伪数组的形式1.3 HTML5新增1.4 获取body和html元素 <script> // 1.获取body 元素 var bodyEle = document.body; console.log(bodyEle); con.原创 2021-09-01 11:30:48 · 115 阅读 · 1 评论 -
显示隐藏密码明文案例
核心思路如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <.原创 2021-09-01 11:23:12 · 516 阅读 · 0 评论 -
倒计时案例的代码(例如某一个平台的秒杀剩余时间)
思路:毫秒计算出来以后通过以下公式将其转换为天时分秒注意:1秒等于1000毫秒 <script> function countDown(time) { var nowTime = +new Date(); // 返回的是当前时间总的毫秒数 var inputTime = +new Date(time); // 返回的是用户输入时间总的毫秒数 var times = (inpu原创 2021-08-31 11:03:06 · 191 阅读 · 0 评论 -
javascript内置对象( 通过MDN查阅文档进行学习 )
1. MDN此处是MDN的网址链接:https://developer.mozilla.org/zh-CN/如何使用MDN?首先查阅该方法的功能查看里边的参数的类型和意义查看返回值的类型和意义通过demo进行测试2. Math对象<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" conten.原创 2021-08-30 21:01:59 · 428 阅读 · 0 评论 -
JavaScript的学习(对象)
1. 创建对象1.1 利用字面量创建对象<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"&原创 2021-08-30 16:40:19 · 160 阅读 · 0 评论