JavaScript(1):实现跑马灯小程序 - 勺子惜白

wangchongzhangdan 2021-08-08 原文


JavaScript(1):实现跑马灯小程序


    1.JavaScript是独立的语言,浏览器具有JS解释器

    2.JavaScript代码存在形式:

    ——head中

<scrip>
        //JavaScript代码
        alert(123);
</scrip>
<scrip type="text/javascript">
        //JavaScript代码
        alert(123);
</scrip>

    ——文件

<script src="js文件路径"></script>

    ——body中

JS代码需要放置在<body>标签的最下方,才是最好的

    3.JS注释

    单行注释://

    多行注释:/*  */

    4.变量

    python:

name="alex"

    JavaScript:

name="alex"  //全局变量
var name="alex"    //局部变量

    5.写JS代码

    -HTML文件中编写

    -临时,浏览器的终端(console)

    6.JS基本数据类型

    (1)数字

    JavaScript中不区分整数和浮点数,其所有数字均用浮点数表示

    parseInt(…)    将某值转换成数字,不成功则NaN

    parseFloat(…)    将某值转换成浮点数,不成功则NaN

    特殊值:

        NaN:非数字,可使用isNaN(num)来判断

        Infinity:无穷大,可食用isFinite(num)来判断

a=18

    (2)字符串

a="alex"
a.charAt(索引位置)     //获取索引位置字符
a.substring(起始位置,结束位置)    //获取起始至结束位置的所有字符,起始<=...<结束
a.length        //获取当前字符串长度

    (3)数组

a=[11,22,33]

    (4)布尔类型

a=true
b=false  //注意是小写

    (5)字典

a={"k1":67,"k2":"v2"}

    (6)Null

    (7)Undefined

    7.console面板输出函数:

console.log("你很美")

    8.定时器setInterval

setInterval("func()",1000);   //每1000毫秒执行一次func()函数

    9.跑马灯程序实现

!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>跑马灯程序实现</title>
</head>
<body>
    <h1 id="first">欢迎大神莅临指导</h1>
    <script type="text/javascript">
        function horse_light() {
            var tag = document.getElementById("first");
//            用tag获取id为first的整个标签
            var content = tag.innerText;
//            获取标签的内部内容
            var head_str = content.charAt(0);
//            获取内容的首字符
            var rest_str =content.substring(1,content.length);
//            获取剩余的所有字符
            var new_content = rest_str + head_str;
//            组成新的字符串
            tag.innerText = new_content;
//            只有通过tag才可以作用到id="first"的<h1>标签
        }
        setInterval("horse_light()",500)
    </script>
</body>
</html>

posted on
2018-05-18 09:33 
勺子惜白 
阅读(116
评论(0
编辑 
收藏 
举报

 

版权声明:本文为wangchongzhangdan原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://www.cnblogs.com/wangchongzhangdan/p/9409638.html

JavaScript(1):实现跑马灯小程序 - 勺子惜白的更多相关文章

  1. ActiveMQ – java博客记录

    ActiveMQ 特点(作用) 应用解耦 异步通信 流量削峰 (海量)日志处理 消息通讯 ActiveMQ是一 […]...

  2. [系列] – go-gin-api 路由中间件 – 日志记录(三)

    目录 概述 gin.Logger() 自定义 Logger() 源码地址 go-gin-api 系列文章 概述 […]...

  3. 第七次作业 – 需求分析报告

    【计划安排】 阶段 主要任务 时间 任务内容 1 项目选题 09.22 – 10.10 确定选题内 […]...

  4. 免费iphone app,帮你41天赚210万rmb – 重粒子

    免费iphone app,帮你41天赚210万rmb 日本多米诺比萨外卖公司(domino‘s)(千代田区,东 […]...

  5. 无所不能的Embedding2 – FastText词向量&文本分类

    Fasttext其实包括两个模型,一个是文本分类模型,效果不算顶尖但胜在轻量高效,另一个词向量模型,主要创新在 […]...

  6. video.js–很赞的H5视频播放库 – stoneniqiu

    video.js–很赞的H5视频播放库 2016-08-27 09:18  stoneniqiu  […]...

  7. 【慕课网实战】Spark Streaming实时流处理项目实战笔记二十之铭文升级版 – 旷课小王子

    【慕课网实战】Spark Streaming实时流处理项目实战笔记二十之铭文升级版 第13章 可视化实战(Ec […]...

  8. MySQL性能测试工具 – JohnChain

    MySQL性能测试工具 The MySQL Benchmark Suite、MySQL super-smack […]...

随机推荐

  1. 代码不规范,同事皮锤现(上)

      没错,在下就是传说中的标题党本党了,可能大家对这个标题都有所理解,now,我们来设想一个情景,当你的老大让 […]...

  2. 微服务之集成(四)

    1. 寻找理想的集成技术 微服务之间通信的方式的选择非常多样化,但哪个是正确的呢?SOAP ? XML-RPC […]...

  3. WORD文档中插入页码技巧大全

    一、页码从第二页开始 1、选择“插入-页码”,打开“页码”对话框。 2、取消“首页显示页码”复选框中的对钩,然 […]...

  4. 如梦令编程语言主页上线了

    经过一段时间的密集开发,如梦令编程语言(RML)主页正式上线了! www.rml-lang.top RML主页 […]...

  5. Elasticsearch的基友Logstash

    Logstash 是一款强大的数据处理工具,它可以实现数据传输,格式处理,格式化输出,还有强大的插件功能,常用 […]...

  6. 【译】Async/Await(二)——Futures

    原文标题:Async/Await 原文链接:https://os.phil-opp.com/async-awa […]...

  7. 用户行为分析模型实践(一)—— 路径分析模型

    路径分析应用是对特定页面的上下游进行可视化展示并分析用户在使用产品时的路径分布情况。 一、需求背景 在互联网数 […]...

  8. POJ-3268 Dijkstra()单源对短路,小技巧0.0

    为了遵守相关法律法规,合法合规运营,网站进行全面整改,整改工作于2021年3月18日12:00开始,预计于3月 […]...

展开目录

目录导航