javascript + jquery实现定时修改文章标题

用javascript+jquery写的一个定时器，定时修改文章标题。


代码如下:

<!DOCTYPE html>
<html>
<head>
<title>TODO supply a title</title>
<meta charset="GB2312">
<meta name="viewport" content="width=device-width">
</head>

<body>
<div>
<ul id="jokeTitle">
<li class="line">Test Line One</li>
<li class="line">Test Line Two</li>
<li class="line">Test Line Three</li>
</ul>
</div>
<script type="text/javascript" src="ie/js/jquery-1.9.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){

var changeJokeTitle = {
line:3, //笑话的总行数
timeSpan:1850, //时间间隔（毫秒）
interval:'', //定时器句柄，以便于停止
showLineFlag:0, //标志，
change:function(){

var currentLine = (++changeJokeTitle.showLineFlag)%(changeJokeTitle.line);

$('#jokeTitle li:eq('+currentLine+')').show();
$('#jokeTitle li:not(:eq('+currentLine+'))').hide();
},
run:function(){
$('#jokeTitle li:eq(0)').show();
$('#jokeTitle li:not(:eq(0))').hide();
changeJokeTitle.interval = setInterval(changeJokeTitle.change, changeJokeTitle.timeSpan);
}
};

changeJokeTitle.run();

});
</script>
</body>

</html>

赞 (0)

相关推荐

  • JavaScript每天定时更换皮肤样式的方法

    本文实例讲述了JavaScript每天定时更换皮肤样式的方法.分享给大家供大家参考.具体分析如下: 这段js代码通过每天在不同时段自动更换网页调用的样式表,实现更换皮肤的功能. <script type="text/JavaScript"> <!-- function getStylesheet() { var currentTime = new Date().getHours(); if (0 <= currentTime&&currentTi

  • 使用javascript实现页面定时跳转总结篇

    下面对使用JavaScript实现页面定时跳转(也称倒计时跳转)做一下总结,各种定时跳转代码记录如下: (1)使用 setTimeout 函数实现定时跳转(如下代码要写在body区域内) 复制代码 代码如下: <script type="text/javascript"> // 3秒钟之后跳转到指定的页面 setTimeout(window.location.href = "http://3aj.cn/javascript/19.html", 3); &

  • Javascript中setTimeOut和setInterval的定时器用法

    Javascript的setTimeOut和setInterval函数应用非常广泛,它们都用来处理延时和定时任务,比如打开网页一段时间后弹出一个登录框,页面每隔一段时间发送异步请求获取最新数据等等.但它们的应用是有区别的. setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式,而setInterval()则是在每隔指定的毫秒数循环调用函数或表达式,直到clearInterval把它清除.也就是说setTimeout()只执行一次,setInterval()可以执行多次.两个函数

  • JavaScript入门之事件、cookie、定时等

    一篇关于"JavaScript语言入门"的文章涵盖了JavaScript语言中许多最基础的内容,从创建脚本标签到使用注释.把JavaScript文件包含到HTML文档中.定义变量.使用运算符.定义数组.使用条件语句.定义函数和使用循环等.本文从上一篇文章结束的地方开始,解释其他的一些基本的JavaScript语言概念,继续为初学者提供对语言的基础理解.本文提及的基础内容能够让你更好地理解所使用的库,知道如何就究竟要不要使用库做出决定,甚至有可能会给你带来一些编写自己的库的勇气.文章自始

  • javascript使用定时函数实现跳转到某个页面

    有时我们跳转到一个页面处理完任务,然后又回到原来的页面,这个在很多的下载网站可以看到,这样做也是为了留住用户. 这个用javascript的定时函数很容易实现. window.setTimeout( code,time) // code 执行的代码 time 设置的时间 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml

  • javascript定时变换图片实例代码

    复制代码 代码如下: <html><head><meta http-equiv=Content-Type content="text/html;charset=utf-8"><script>y=1;function imgs(){    var myImg=document.getElementsByTagName("img")[0];    myImg.src=y+".jpg";    if(y=

  • Javascript倒计时（定时）执行跳转事件的代码

    9 document.getElementByIdx_x=function(id){ if(typeof id =='string') return document.getElementById(id); else throw new error('please pass a string as a id!') } var timer = window.setInterval(function(){ document.getElementByIdx_x('box').innerHTML = p

  • Javascript/Jquery——简单定时器的多种实现方法

    第一种方法: 复制代码 代码如下: <%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/x

  • javascript + jquery实现定时修改文章标题

    用javascript+jquery写的一个定时器,定时修改文章标题. 复制代码 代码如下: <!DOCTYPE html> <html> <head> <title>TODO supply a title</title> <meta charset="GB2312"> <meta name="viewport" content="width=device-width"

  • javascript(jquery)利用函数修改全局变量的代码

    我是将当前页用一个全局变量存储.同时在"最后一页"链接里单击方法调用一个函数自动去修改页数为最后一页,然后再调用载入评论的方法. 可是我发现点击"最后一页"第一次的时候系统没反应,再点击一次就抓去最后一页的资料了! 要说全局变量没改,应该是改了,就仿佛改了页数而载入评论的方法失效了一样. 代码如下: 复制代码 代码如下: var page = 1; //初始化页数为第一页 var str = ""; $(document).ready(funct

  • 利用原生JS自动生成文章标题树的实例

    实现原理很简单,就是循环文章模块,并抽取其中的h2.h3标签,将其中的内容赋予给新建的title树. 代码如下: HTML代码: <div class="contextBox"> <div id="article"> <h2>二级标题</h2> <h3>三级标题</h3> <p>hello hello hello hello hello hello hello hello hello

  • JavaScript jQuery 中定义数组与操作及jquery数组操作

    首先给大家介绍javascript jquery中定义数组与操作的相关知识,具体内容如下所示: 1.认识数组 数组就是某类数据的集合,数据类型可以是整型.字符串.甚至是对象 Javascript不支持多维数组,但是因为数组里面可以包含对象(数组也是一个对象),所以数组可以通过相互嵌套实现类似多维数组的功能 1.1 定义数组 声明有10个元素的数组 复制代码 代码如下: var a = new Array(10); 此时为a已经开辟了内存空间,包含10个元素,用数组名称加 [下标] 来调用,例如

  • Javascript拖拽&拖放系列文章3之细说事件对象第1/4页

    Javascript拖拽&拖放系列文章3之细说事件对象第1/4页

    在阅读本文前,可以先阅读<Javascript拖拽&拖放系列文章2之offsetLeft.offsetTop.offsetWidth.offsetHeight属性>这篇文章,以理清上下文关系.好了,让我们开始进入正题. 模型相同的属性/方法 1 Button属性 Integer类型,可读可写.对于特定的鼠标事件,表示按下的鼠标按钮,它可以在拖拽的时候,判断是否是鼠标左键引发mousedown事件.它的所有取值及其意义(参考自<Javascript高级程序设计>)好了,让我们

  • JavaScript jquery及AJAX小结

    JavaScript jquery及AJAX小结

    其实在学习之前,就已经用上了js,jquery和ajax,不过当时不清楚这些的区别,就全都当成js来看,然后别人一说jquery,ajax都觉得好像很高级,等到自己学习的时候,倒是对这些更清楚了一点,下面就来写一下我的总结. 简介 Javascript JavaScript,一种直译式脚本语言,是一种动态类型.基于原型的语言,内置支持类.它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML网页上使用,用来给HTML网页增加动态功能.然而现在Jav

  • jQuery实现定时隐藏对话框的方法分析

    本文实例讲述了jQuery实现定时隐藏对话框的方法.分享给大家供大家参考,具体如下: 以下内容可能不完全正确,只是在有问题时进行参考. 1. setTimeout :出现设置了时间,但是程序立即执行的情况. :无论是window.setTimeout还是window.setInterval,在使用函数名作为调用句柄时都不能带参数. :解决就是定义一个匿名函数 setTimeout(function(){$j('#pre'+ID).fadeOut()},12000); :第二个参数是毫秒数,1秒=

  • 通过jquery toggleClass()属性制作文章段落更改背景颜色

    通过jquery toggleClass()属性制作文章段落更改背景颜色

    定义和用法 toggleClass() 方法对添加和移除被选元素的一个或多个类进行切换. 该方法检查每个元素中指定的类.如果不存在则添加类,如果已设置则删除之.这就是所谓的切换效果. 然而,通过使用 "switch" 参数,您能够规定只删除或只添加类. 语法 $(selector).toggleClass(classname,function(index,currentclass),switch) 参数 描述 classname 必需.规定添加或移除的一个或多个类名.如需规定若干个类,

  • JavaScript/jQuery实现切换页面效果

    JavaScript/jQuery实现切换页面效果

    本文实例为大家分享了JavaScript/jQuery实现切换页面效果的具体代码,供大家参考,具体内容如下 <!DOCTYPE html> <html lang="en">     <head>         <meta charset="UTF-8" />         <meta http-equiv="X-UA-Compatible" content="IE=edge&qu

  • javascript+jQuery实现360开机时间显示效果

    javascript+jQuery实现360开机时间显示效果

    实现效果: 实现原理: 给关闭按钮绑定点击事件,点击以后触发动画效果.利用jQuery的animate方法,先让显示天气的盒子高度变为0,接着让整个包含天气和事件的盒子宽度变为0,最后通过将display属性值设为none,使得close按钮消失. 实现代码: <!DOCTYPE html> <html> <head> <title>仿360开机效果</title> <meta charset="utf-8"> &

随机推荐