JS中定时器的使用以及lacation对象的多个案例

5秒之后页面跳转
在这里插入图片描述
在这里插入图片描述
注册绑定事件之后,需要URL部分只是 location.href得到的是整个链接 ,将跳转的页面内容赋给div ,使用定时器倒计时实现时间的变化。

手机短信的倒计时
在这里插入图片描述
案例分析:获取URL参数数据 数据在不同页面的相互传递
1、第一次登录页面,里面有提交表单 action提交到index.html页面
2、第二个页面,可以使用第一个页面的参数,这样实现了一个数据不同页面的传递效果
3、第二个页面之所以可以使用第一个页面的数据,是利用URl里面的location.search参数
4、在第二个页面中,需要把这个参数提取
5、第一步利用? 利用substr
6、第二步利用=号分割键和值 spit(’=’)
在这里插入图片描述
另一个html里面添加div在这里插入图片描述
在这里插入图片描述
在此HTML中添加js样式,完成页面的跳转。将一个页面的数据送到另一个页面中。

在JavaScript,可以通过封装定时器来实现多个组件的定时功能。以下是一个简单的例子: ```javascript // 定义一个封装了定时器的组件 function TimerComponent(interval, callback) { this.interval = interval; // 定时器间隔时间 this.callback = callback; // 定时器回调函数 this.timerId = null; // 定时器Id } // 启动定时器 TimerComponent.prototype.start = function() { // 判断定时器Id是否已存在,如果存在则表示已启动过,不再重复启动 if (this.timerId) { return; } // 使用箭头函数确保回调函数内部使用正确的this对象 this.timerId = setInterval(() => { // 调用回调函数 this.callback(); }, this.interval); } // 停止定时器 TimerComponent.prototype.stop = function() { // 清除定时器Id clearInterval(this.timerId); this.timerId = null; } // 创建多个定时器组件实例 var timer1 = new TimerComponent(1000, function() { console.log("定时器1触发"); }); var timer2 = new TimerComponent(2000, function() { console.log("定时器2触发"); }); // 启动定时器 timer1.start(); timer2.start(); // 停止定时器 // timer1.stop(); // timer2.stop(); ``` 以上代码,我们定义了一个`TimerComponent`对象,该对象包含了一个定时器的间隔时间和回调函数,并且提供了启动和停止定时器的方法。通过创建多个`TimerComponent`实例,每个实例都可以设置不同的定时器间隔和回调函数。调用`start`方法可以启动定时器,调用`stop`方法可以停止定时器。这样,我们就可以通过封装定时器来实现多个组件的定时功能。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值