1.看了写跑马灯的教程案例,隔了段时间自己写了一个简单的跑马灯。将过程中遇到的问题特此记录下来

代码如下:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=gb2312">
<title>简&nbsp;陋&nbsp;的&nbsp;管&nbsp;理&nbsp;后&nbsp;台&nbsp;</title>
</head>
<body>
<input type='button' value='stop TitleLoop' id='stoploop'/> <script src='C:\Users\wujy1\Desktop\html\js\jquery-3.1.1.min.js'></script>
<script> function TitleLoop(){ //实现标题循环
var Title=$('title').text();
FirstWord=Title[]; //保存字符串第一个字符
Title=Title.substring(); //将字符串第一个字符截取掉
/*
document.title=Title+FirstWord; 使用该方法比较占用内存。例如:
var lang = "Java";
lang = lang + "Script";
首先创建一个能容纳10个字符的新字符串,然后在这个字符串
中填充“Java”和“Script”,最后一步是销毁原来的字符串“Java”
和“Script”,因为这两个字符串已经没用了。但是在低版本的浏
览器(如IE6)中,字符串拼接速度是很消耗一个性能的过程。
*/
var arry=Array(Title,FirstWord); //将新字符串和第一个字符定位为数组(要注意顺序),使用join方法拼接起来
Title=arry.join("");
$('title').text(Title); //更改title内容
} var loop=setInterval("TitleLoop()",); //启用循环
$('#stoploop').click(function(){clearInterval(loop);}); //结束循环 </script>
</body>
</html>

问题:

  当我要结束循环,使用以下代码并不可以结束进程:

$('#stoploop').click(function(){clearInterval(setInterval("TitleLoop()",500));})

  查看clearInterval说明:clearInterval() 方法的参数必须是由 setInterval() 返回的 ID 值。

  这时候使用:

var loop=setInterval("TitleLoop()",500);
console.log(loop); #返回1
console.log(setInterval("TitleLoop()",500)) #返回2
console.log(setInterval("TitleLoop()",500)) #返回3

  所以关闭循环必须将循环赋值给变量,然后关闭掉这个循环。

  这时候猜测,每当定义一个  setInterval()时,他的ID值就会加1.验证下:

javascript 跑马灯的更多相关文章

  1. JavaScript “跑马灯”抽奖活动代码解析与优化(二)

    既然是要编写插件.那么叫做"插件"的东西肯定是具有的某些特征能够满足我们平时开发的需求或者是提高我们的开发效率.那么叫做插件的东西应该具有哪些基本特征呢?让我们来总结一下: 1.J ...

  2. JavaScript “跑马灯”抽奖活动代码解析与优化(一)

    最近的项目中做了一个"跑马灯"的抽奖特效插件.上篇文章已经分享过html和css 的相关知识.这篇文章主要分享一些 JavaScript 相关的知识.这几天在写这篇文章的时候,也顺 ...

  3. javascript跑马灯抽奖

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. javascript小记五则:用JS写一个图片左右自由滚动的“跑马灯”效果

    之前看了很多百度搜索出的东西,十个有九个是不能实用的,个个讲的都不详细,今天详细给大家讲解下关于这个图片“跑马灯”滚动效果,源码如下: <!DOCTYPE html PUBLIC "- ...

  5. JavaScript小实例-文字跑马灯效果

    我们常常能看到显示屏上字体的滚动以及手机弹幕等,下面所示代码就是一个简易的文字跑马灯的效果: <!DOCTYPE html> <html> <head lang=&quo ...

  6. javascript之网页跑马灯

    ---恢复内容开始--- <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  7. JavaScript实现文字跑马灯

    其实实现文字的跑马灯和实现图片轮播的原理是一样的. 下面是我自己实现的,文字的位置可以随便更改,效果不会变,文字的内容可以通过ajax获取,同时,可以直接用Jquery改写一下,很方便. <!D ...

  8. jq跑马灯效果

    这几天公司产品有个无缝循环滚动的广告跑马灯要做,最开始想到的是<marquee>标签,但在PC端正常,在安卓广告屏上却怎么都跑不动,后来用的css3的animation,结果也是PC端及其 ...

  9. jQuery+CSS3文字跑马灯特效

    jQuery+CSS3文字跑马灯特效是一款将跑马灯背景制作为3D立方体效果,文字在上面移动时,就像是文字投影到墙壁上,在转角出会改变运动方向. 效果展示 http://hovertree.com/te ...

随机推荐

  1. kafka+docker+python

    昨天晚上刚刚才花3小时看完<日志:每个软件工程师都应该知道的有关实时数据的统一概念>. 今天就把kafka在docker容器里运行起来,github上有几个,但都太复杂了. 我自己写个最简 ...

  2. 在shell终端操作oracle数据库的常用命令

    这里面是在一个项目中用到的操作oracle数据库的常用linux命令,因为当时无法用plsql远程连接,大部分操作都需要在命令行窗口进行,总结一下 第一种方式 (1)先切换至sqlplus [orac ...

  3. spring: beanutils.copyproperties将一个对象的数据塞入到另一个对象中(合并对象)

    spring: beanutils.copyproperties将一个对象的数据塞入到另一个对象中(合并对象) 它的出现原因: BeanUtils提供对Java反射和自省API的包装.其主要目的是利用 ...

  4. 取代iframe框架

    一.frameset1. 属性①border设置框架的边框粗细.②bordercolor设置框架的边框颜色.③frameborder设置是否显示框架边框.设定值只有0.1:0 表示不要边框,1 表示要 ...

  5. 怎么从bam文件中提取出比对OR没比对上的paired reads | bamToFastq | STAR

    折腾这么多都是白瞎,STAR就有输出没有别对上的pair-end reads的功能 参见:How To Filter Mapped Reads With Samtools I had the same ...

  6. English Voice of << Count on me >>

    Count On Me 歌手:Bruno Mars 所属专辑:It´s Better If You Don´t Understand If you ever find yourself stuck i ...

  7. 算法之如何实现LRU缓冲淘汰策略

    1)什么是缓存? 缓存是一种提高数据读取性能的技术,在硬件设计.软件开发中都有着非广泛的应用,比如常见的CPU缓存.数据库缓存.浏览器缓存等等. 2)为什么使用缓存?即缓存的特点缓存的大小是有限的,当 ...

  8. java开学第一周测试代码

    Account.java /* 信1705-3 20173612  陈阳阳 */package ATM; public class Account { private String accountID ...

  9. linux搭建DHCP

    动态主机配置协议(DHCP,Dynamic Host Configuration Protocol),该协议用于自动管理局域网内主机的IP地址.子网掩码.网关地址及DNS地址等参数,可以有效地提升IP ...

  10. pyhon基础之约束和异常处理:

    约束和异常处理:内容梗概: 1. 类的约束 2. 异常处理 3. 自定义异常 4. 日志 1. 类的约束定义:约束是对类的约束常用方法:1. 提取父类.然后在父类中定义好方法.在这个方法中什么都不用干 ...