<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style>

        .pmd{

            width:200px;

            height: 100px;

            color: red;

            position: absolute;

            left:50%;

            top:50%;

            margin-left:-100px;

            margin-top:-100px;

        }

    </style>

</head>

<body>

 <div class="pmd" id="i1"  >快看我写了个跑马灯</div>

 <div id="i2" class="pmd" style="margin-top: 200px" >这是一个滚动播放的内容</div>

</body>

<script>

    //创建一个定时器

    //setInterval('alert(123)',2000)

    //定义一个函数

    function f1(data) {

        alert(data);

    }

    //调用函数 注意用''将函数括起来

    //也可以写成

    //setInterval(function(){ f1("这是一个弹窗")},2000)

    //setInterval('f1("这是一个弹窗")',2000)

    //跑马灯 替换第一个字符到最后

    function f2() {

        var tag=document.getElementById('i1');

        var content=tag.innerText

        var f=content.charAt(0)

        var l=content.substring(1,content.length)

        var new_content=l+f;

        tag.innerText=new_content;

    }

    //定时执行

    setInterval('f2()',100)

    //替换最后一个字符到最前面 嘿嘿嘿

    function f3() {

        var tag=document.getElementById('i2');

        var content=tag.innerText

        var length=content.length-1

        var f=content.charAt(length)

        var l=content.substring(0,content.length-1)

        var new_content=f+l;

        tag.innerText=new_content;

        console.log()

    }

    setInterval('f3()',500)

</script>

</html>

　　

js之定时器操作的更多相关文章

  1. js之定时器

    一.通过定时器我们可以间隔设定时间重复调用某个函数,利用这个特性,我们可以做很多事,例如,12306上的每间隔5秒查询自动查询一次余票,简单动画的实现等等 二.定时器的格式: 定时器有两种格式,分别是 ...

  2. JS的BOM操作语法

    整理了一下JS的BOM操作语法,这里记录一下. <!DOCTYPE html> <html> <head> <meta charset="utf-8 ...

  3. 【JavaScript基础】Js的定时器（你想看的原理也在哟）

    [JavaScript基础]Js的定时器(你想看的原理也在哟) 博客说明 文章所涉及的资料来自互联网整理和个人总结,意在于个人学习和经验汇总,如有什么地方侵权,请联系本人删除,谢谢! 说明 本章是经历 ...

  4. js实现动态操作table

     本章案例为通过js,动态操作table,实现在单页面进行增删改查的操作. 简要案例如下: <%@ page language="java" contentType=&quo ...

  5. nw.js如何处理拖放操作

    nw.js如何处理拖放操作 其实拖放(drag-drop)操作是Html5的功能,不是nw.js的内置API,那么我们采用Html5应用一般的处理方法就可以了. 首先我们看一下一个正常的页面,直接拖放 ...

  6. Numeral.js – 格式化和操作数字的 JavaScript 库

    Numeral.js 是一个用于格式化和操作数字的 JavaScript 库.数字可以格式化为货币,百分比,时间,甚至是小数,千位,和缩写格式,功能十分强大.支持包括中文在内的17种语言. 您可能感兴 ...

  7. 【软件编程】乐易贵宾VIP教程 - JS改写+网页操作系列教程

    JS改写系列教程: 1.MD5加密改写教程(爱拍网登录)2.解密如何快速找到真确的js加密算法3.多重MD5加密改写教程(5173登录)4.DZ论坛登录加密改写5.唯品会手机登录加密改写6.新浪微博密 ...

  8. JS实现 键盘操作

    JS实现 键盘操作: 详情可以去其逛网查看其API并下载,地址:http://craig.is/killing/mice <!DOCTYPE html PUBLIC "-//W3C// ...

  9. js中如何操作json数据

    一.要想熟练的操作json数据,就先要了解json数据的结构,json有两种结构:对象和数组. 1.对象 一个对象以“{”开始,“}”结束.每个“名称”后跟一个“:”:“‘名称/值’ 对”之间使用“, ...

随机推荐

  1. [Codeforces 496E] Distributing Parts

    [题目链接] https://codeforces.com/contest/496/problem/E [算法] 按右端点排序 , 每个乐曲优先选取的左端点最大的演奏家 用std :: set维护贪心 ...

  2. POJ3675 Telescope 圆和多边形的交

    POJ3675 用三角剖分可以轻松搞定,数据也小 随便AC. #include<iostream> #include<stdio.h> #include<stdlib.h ...

  3. 谈CSS布局中HTML标签语义化

    很多人都在做前端,当然这里包括很多新手,也许在新手的想法就是在做布局的时候不要用font标签之类的就算是web标准了,这样一来,造成如今网上“div泛滥”,一看源文件,霍,除了div没其他标签了. 这 ...

  4. bzoj 1672: [Usaco2005 Dec]Cleaning Shifts 清理牛棚【dp+线段树】

    设f[i]为i时刻最小花费 把牛按l升序排列,每头牛能用f[l[i]-1]+c[i]更新(l[i],r[i])的区间min,所以用线段树维护f,用排完序的每头牛来更新,最后查询E点即可 #includ ...

  5. 解决WebSocket后台报错：The WebSocket session [0] has been closed and no method (apart from close()) may be called on a closed session

    场景1: 在后台数据对前台页面进行数据实时推送下,后台采取定时查询数据后,推送给前台页面.在这个过程中,前台页面不停的刷新页面,session在不停的关闭和开启,推送数据时,会出现session连接已 ...

  6. 使用Oracle实现的MyBatis分页查询效果

    1.mybatis.xml <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE configur ...

  7. dos 下小tip

    tip 1:日期的格式化 方法如下: Echo %Date:~0,4%%Date:~5,2%%Date:~8,2%或者Set dt=%Date:~0,4%%Date:~5,2%%Date:~8,2%E ...

  8. Axis通过wsdd部署Web Service

    axis网上的教程很多,不过搜来搜去,总是只有那么几篇.仔细看了一下那几篇文章,都感觉到不是自己想要的,所以自己整理了一篇分享一下. 本文介绍axis应用的一个小例子,没有麻烦的命令行操作,只需照下面 ...

  9. c语言数据读入---sscanf、fscanf

    #include <iostream> #include <cstdio> #include <cstring> #include <stdlib.h> ...

  10. HTML+CSS 基础布局（案列一）

    刚html刚讲完马上就接着css,周末的任务就是高仿案例,结果有点遭 图文布局 代码 css(内部样式) html <!DOCTYPE html><html><head& ...