开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

Javascript打字机无限循环

JavaScript打字机无限循环是指通过JavaScript代码实现一个无限循环的打字机效果。在这个效果中，文字会不断地以打字机的方式逐个显示出来，直到全部显示完毕后再重新开始循环。

这个效果可以通过以下步骤实现：

创建一个HTML页面，并在页面中添加一个用于显示文字的元素，例如一个<div>元素。
在JavaScript中，使用一个数组来存储要显示的文字内容。每个文字可以作为数组的一个元素。
使用JavaScript的定时器函数（例如setInterval()）来定时执行一个函数，该函数用于逐个显示文字。
在定时器函数中，通过修改文字元素的内容，逐个显示数组中的文字。可以使用字符串拼接或者字符串切片的方式来实现逐个显示的效果。
当显示完所有文字后，重新开始循环，即将文字元素的内容重置为空，然后再次逐个显示文字。

以下是一个简单的示例代码：

<!DOCTYPE html>
<html>
<head>
    <title>JavaScript打字机无限循环</title>
</head>
<body>
    <div id="text"></div>

    <script>
        var textElement = document.getElementById("text");
        var textArray = ["Hello", "World", "JavaScript", "Typewriter", "Infinite", "Loop"];
        var currentIndex = 0;

        function typeWriter() {
            textElement.innerHTML = "";
            var currentText = textArray[currentIndex];
            var i = 0;
            var interval = setInterval(function() {
                if (i < currentText.length) {
                    textElement.innerHTML += currentText.charAt(i);
                    i++;
                } else {
                    clearInterval(interval);
                    setTimeout(function() {
                        typeWriter();
                    }, 2000); // 等待2秒后重新开始循环
                }
            }, 100); // 每100毫秒显示一个字符
            currentIndex = (currentIndex + 1) % textArray.length;
        }

        typeWriter();
    </script>
</body>
</html>

这个示例代码会在页面中创建一个<div>元素，并将文字逐个显示为"Hello"、"World"、"JavaScript"、"Typewriter"、"Infinite"、"Loop"，然后重新开始循环。每个字符的显示间隔为100毫秒，每次循环之间的间隔为2秒。

这个效果可以用于网站的欢迎页面、特殊公告的展示等场景。在腾讯云的产品中，可以使用腾讯云的云服务器（CVM）来托管网站，并使用腾讯云的云数据库（TencentDB）来存储文字内容。具体的产品介绍和链接地址可以参考腾讯云的官方文档。

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

【网页特效】11 个文本输入和 6 个按钮操作特效库

地址:https://github.com/lindelof/power-mode-input

04

用纯 CSS 实现文本打字机效果，一定很酷！

让我们首先为我们的打字机效果创建web页面。它将为我们的打字机文本包含一个

01

打字机效果的实现与应用

在 web 应用中，模拟编辑器或者模拟输入框中文字啪啦啪啦输入的效果，往往能够吸引人们的眼球，让用户的注意力聚焦在输入的内容上，其实使用的是 web 动画模拟打字机效果，本文将和大家探讨打字机效果的实现方式以及应用。

02

这恐怕是地球上最通用的JavaScript动画打字库吧~

如果把他放到自己的博客首页，相信一定会惊艳浏览者，今天就为大家带来一份地球上最通用的JavaScript动画打字实用程序——typeit

02

原荐 PHP 在 Console 模式下的

关于 \r\n 的由来说到换行，大家都知道在在写程序时，提示语的结尾换行，在 Win 下 \r\n 在 Mac 和 Linux 下 \n 表示，说到这里就要引用下阮一峰大神的一篇关于换行的文章: 回车和换行。在计算机还没有出现之前，有一种叫做电传打字机（Teletype Model 33）的玩意，每秒钟可以打10个字符。但是它有一个问题，就是打完一行换行的时候，要用去0.2秒，正好可以打两个字符。要是在这0.2秒里面，又有新的字符传过来，那么这个字符将丢失。于是，研制人员想了个办法解决这个问题，就是

01

Vue3实现打字机效果

typeit 介绍 typeit是一款轻量级打字机特效插件。该打印机特效可以设置打字速度，是否显示光标，是否换行和延迟时间等属性，它可以打印单行文本和多行文本，并具有可缩放、响应式等特点。官方文档安装 # npm npm install typeit # pnpm pnpm add typeit 代码 <template> </template> <script setup> // https://www

01

键盘的排列为什么不是“ABCD”而是“QWER”?

哈喽！各位小伙伴大家好呀！本期就来分享下我们常用的键盘，它的字母排列方式为什么不是按顺序排列，而是看似杂乱无章的排列这个就要从键盘的起源说起了，有看过老电影的朋友们或许看到过，在早期没有

01

回车(CR)与换行(LF)， '\r'和'\n'的区别

换行LF-将光标“垂直”移动到下一行。（而并不移动到下一行的开头，即不改变光标水平位置）

03

[oeasy]python0109_tty_打字头_电传打字机_字模_点阵字库

点阵字库回忆上次内容上次回顾了字符字型的进化过程从谷腾堡活字到罗马正字和意大利斜体罗马帝国战斗力的征服和基督教文化传播使得拉丁字符在日耳曼语地区广泛传播种葡萄喝葡萄酒的拉丁文化被种小麦喝啤酒的日耳曼人学习了意大利面和披萨饼也是很好吃的两次工业革命会给字体的字型带来什么变化呢？🤔 电传打字机时代的字型 ASR-33作为一代机皇某种程度创建并统一了英文字母的标准写法相对于艺术风格 ASR-

00

15 个初学者 JavaScript 项目来提高你的前端技能！

要成为一名优秀的 Web 开发人员，最快的方法就是练习。一个很好的练习方法是尽可能多地构建初学者项目。那是因为每个项目都会提出一个独特的问题和解决方案，因此您解决的项目越多，您获得的知识就越多。将您完成的每个项目都视为您获得的奖牌。您拥有的奖牌越多，您就越能准备好应对下一个难度更大的项目。

02

极客少年把爷爷的老打字机改造成酷炫乐器！疫情在家已经无聊成这样了？

第一个在文摘菌脑海浮现的，就是经典恐怖电影《闪灵》中大厅中陈放的那款打字机，男主用它写了一部只有一句话的小说，“All work and no play makes jack a dull boy”。

01

[oeasy]python0037_电传打字机_打印头_print_head_carriage_词源

换行回车回忆上次内容上次我们 diy了自己的小动物还可以让小动物变色、报时还可以说些话这很亚文化很酷炫的亚文化不是吗？回忆一下最开始研究报时的时候回到本行行头的方法print(“\r”+ascii_time)\r 与 \n 不同从含义上来看 \n - LF - LineFeed - 换行\r - CR - CarriageReturn - 回车换行和回车具体有什么不同吗？🤔换行回车说到换行回车呢… 就得回到回车换行的年代看看那时候的终端设备也就是 TTY

02

[oeasy]python0125_汉字打印机_点阵式打字机_汉字字形码

汉字字形码回忆上次内容 IBM 将 ASCII 扩展之后规定了一个字节的字符集并制作了相应的字形库添加图片注释，不超过 140 字（可选）这种显示模式和字符大小之下中文该如何进入计算机世界呢？🤔从打印机开始原来的打印头字型定死添加图片注释，不超过 140 字（可选）中文印刷落后于英文中文打字机就是一个梦中文打字机添加图片注释，不超过 140 字（可选）中文打字员添加图片注释，不超过 140 字（可选）针式打印机通过字库数据来驱动针头添加图片注

00

北大最神博士论文：为什么学校打印店老板大多是湖南人？

多媒体出版行业中，充满油墨芬芳的印刷总是长盛不衰。特别是在大学校园里，总是流传着打印店老板的各种神奇传说。

04

linux中tty由来

从UNIX到Linux，你一定听说过TTY这个词。作为桌面用户，你应该会用到它，并且你经常使用它。在教程中，让我提及让你熟悉Linux中的术语TTY所必需的一切。请注意，对此没有明确的答案，但它与过去输入/输出设备的交互方式有关。因此，你必须了解一些历史才能获得清晰的理解。 tty的历史这一切都始于1830年代的电传打字机。电传打字机可让你通过线路发送/接收短信。它取代了摩尔斯电码通信，在这种通信中，需要两个操作员才能有效地相互通信。而且，电传打字机只需要一个操作员即可轻松传达信息。虽然它没有现代布局的

02

基于GPT搭建私有知识库聊天机器人（六）仿chatGPT打字机效果

在前几篇文章中，我们已经了解了如何使用 GPT 模型来搭建一个简单的聊天机器人，并在后端使用私有知识库来提供答案。

03

窃听风云| 苏联如何用IBM打字机获取美国情报

在一份首次发表后几年最近又重新浮出水面的国家安全局备忘录中，记载了对很可能是全世界史上第一个键盘记录器的详细分析：七十年代苏联间谍将窃听器植入美国外交官的IBM Selectric电动打字机，用来监视机密信件和备忘录。这枚机电植入物是一个不小的工程奇迹。高度小型化的一系列电路板被塞进一条打字机长度的金属棒，使得肉眼看不出它们。这个只能用X射线看到的植入物记录电动打字机用来在纸上打印字符的字球的精确位置。除了空格、制表符、连字符和退格，这个微型装置有记录每个按键并实时发送回苏联间谍的能力。 “获利丰厚的信息

09

回车与换行的故事

以前在学汇编的时候，一直不知道老师在换行时，总会打一个换行符和回车符，原来他们还有这么一个故事….

03

[oeasy]python0041_teletype历史_博多码_shift_capslock_字符数字切换_gear

teletypewriter 历史回忆上次内容上次见到了一个真的机械打字机感受到了蒸汽朋克的时代背景上上次区分了一些概念 terminal终端，电脑连线最终的端点TeleTYpewriter，电传打印机，终端硬件shell，终端硬件基础上的软件壳子Console 控制台，直接连接主机的控制面板换行和回车是两回事换行对应字节0x0A Line-Feed 的意思是水平不动、垂直向上喂纸所以是feed回车对应字节0x0D Carriage-Return意思是让上图可移动的打印头好像可移动的四轮马车 Ca

00

1979年的电子打字机

上周五，《大西洋》月刊的记者James Fallows，在Blog上回忆28年前（1982年）的一篇旧文。那个时候，他刚入行不久，每周有大量的写稿任务，天天都是在打字机旁度过。这种生活让他痛苦不堪，因为打字机实在太不方便了。如果他写一篇6000个单词的长篇报道，用A4纸印刷出来需要8页，但是用双倍行距在打字机上打出来，需要100页！其中任何一个单词打错了，整页都要重新打。他的文章通常需要修改5遍以上，并且最终定稿时需要多个副本。因此，打字工作量可想而知。此时，James Fallows想起了，他在杂志

04

北大最神博士论文：为什么学校打印店老板大多是湖南人？

作者 | 冯军旗 01 写在前面（非论文部分）多媒体出版行业中，充满油墨芬芳的印刷总是长盛不衰。特别是在大学校园里，总是流传着打印店老板的各种神奇传说。比如在北京，在任何一个大学周围或者商务楼群的边缘地带，只要有几栋“底商”的租价极其便宜的老式居民楼、几排在拆迁的传言中惴惴不安的小平房，甚至几间用石棉瓦、白铁皮搭起来的违章小窝棚，你都会看见一些招魂幡一样神出鬼没的简陋招贴，上书“复印5分（双面）、打印1角，量大从优”。在招贴附近，总会有那么一群老少混杂、拖家带口的人在一个狭小的室内空间里围着几台破旧的

01

BZOJ2434: [Noi2011]阿狸的打字机(AC自动机树状数组)

Time Limit: 10 Sec Memory Limit: 256 MB Submit: 4140 Solved: 2276 [Submit][Status][Discuss] Description 阿狸喜欢收藏各种稀奇古怪的东西，最近他淘到一台老式的打字机。打字机上只有28个按键，分别印有26个小写英文字母和'B'、'P'两个字母。经阿狸研究发现，这个打字机是这样工作的： l 输入小写字母，打字机的一个凹槽中会加入这个字母(这个字母加在凹槽的最后)。 l 按一下印有'B'的按键，打字机凹槽

03

人类6大未解谜题、世界著名10大思想实验和哲学命题

导读：当人工智能发展到可以跟你流利对话的程度，是否意味着它已真正拥有智能并学会思考？

02

这个奇葩打字外设火了，一分钟500词比说话还快，直接被打字比赛禁用

对，你没看错，这种新型打字机（CharaChorder）没有按键，而是靠每个手托上的9个摇杆来输入字符。

01

java中%c%n是什么意思_在编码时如何使用\r与\n，两者的区别

\r：全称：carriage return (carriage是“字车”的意思，打印机上的一个部件)

03

零基础入门 14： UGUI 打字机效果实现

如上图，效果大概就是这样，有一段文字，和音频，文字要这种显示效果，并且在文字出现的时候，要有背景键盘音效的声音，来模拟打字机的效果。最好还可以调整文字的出现速度。

02

每行字符数（CPL）的起源

前几天，我收到网友小龙的Email。他想与我讨论一个问题： "各种计算机语言的编码风格，有的建议源码每行的字符数（characters per line）不超过72个，还有的建议不超过80个，这是

06

java中\n\r的区别原

回车”（Carriage Return）和“换行”（Line Feed）这两个概念的来历和区别。在计算机还没有出现之前，有一种叫做电传打字机（Teletype Model 33，Linux/Unix下的tty概念也来自于此）的玩意，每秒钟可以打10个字符。但是它有一个问题，就是打完一行换行的时候，要用去0.2秒，正好可以打两个字符。要是在这0.2秒里面，又有新的字符传过来，那么这个字符将丢失。于是，研制人员想了个办法解决这个问题，就是在每行后面加两个表示结束的字符。一个叫做“回车(return)”，告诉打字机把打印头定位在左边界；另一个叫做“换行(newline)”，告诉打字机把纸向下移一行。这就是“换行”和“回车”的来历，从它们的英语名字上也可以看出一二。

02

打字机效果 | 又一款花里胡哨的打字机js

又一款花里胡哨的打字机效果，之前在github上看到过一个不那么花的打字机，它的效果大概是下面这样：

02

这键盘“跪”了上百年，竟没有多大变化

新年新气象！大家今年肯定都有很多新想法等着实现或者正在准备吧~同样小编哥哥也有一个小小的新目标——永远年轻！哎对了，听说咱们年轻人呐平时都喜欢刷B站，关注各种UP主，追番，在二次元世界里生活。小编哥哥还专门刷了B站制作的跨年晚会，看完后，真是惊呆了！！让我印象深刻的就是方锦龙VS赵兆指挥的百人团队，尺八吹火影、琵琶弹《十面埋伏》和教父，方全会大师啊，请收下我的膝盖和我的刷屏弹幕……紧张激烈的刷屏弹幕编辑中……不过还好，有搜狗输入法，打字就像飞起来一样^_^

00

100个最常问的JavaScript面试问答-第1部分（共10部分）

JavaScript（JS）是一种具有一流功能的轻量级，解释性或即时编译的编程语言。尽管它是最著名的网页脚本语言，但许多非浏览器环境也使用它，例如Node.js，Apache CouchDB和Adobe Acrobat。JavaScript是基于原型的，多范式，单线程的动态语言，支持面向对象，命令式和声明式（例如，函数式编程）样式。

02

理解Linux 终端、终端模拟器和伪终端

你可能听说过 TTY 和 PTY 这些缩写，也在 /dev 目录下看到过 /dev/tty[n] 设备，大概知道它们和 Linux 终端的概念有关。可是你清楚 TTY、PTY 具体指的是什么，它们有什么区别，以及它们和 shell 又是什么关系呢？为了理解这些，我们需要先回顾一下历史。

01

AC自动机和Fail树

Fail指针的基本性质：某只结点的Fail指针，指向它所代表的字符串的最长的后缀的结点。

02

从粉笔到软件代码——用数学语言写作

大数据文摘授权转载自zzllrr小乐作者：Whitney Clavin 译者：zzllrr小乐在过去的几十年里，当研究人员不得不敲打打字机来撰写他们的科学论文时，他们经常会遇到障碍。这些机器，包括1960年代至1980年代流行的IBM Selectric系列，不包含数学符号的键，例如用于表示微积分的长“S”。当需要输入等式时，研究人员不得不寻找高尔夫球大小的银色球体，其中包含适当的字符以卡入打字机。有些人寻求解决方法来避免麻烦。 “我没有耐心使用IBM Selectric并切换球，”理查德·费曼理论物理

01

富文本打字机效果

打字机效果也就是让文字逐个在屏幕中显示，直到把整段话说完，常常被应用到人物对话，角色旁白以及引导教程等高频场景中。

03

回车和换行

今天，我总算搞清楚"回车"（carriage return）和"换行"（line feed）这两个概念的来历和区别了。在计算机还没有出现之前，有一种叫做电传打字机（Teletype Model 33）的玩意，每秒钟可以打10个字符。但是它有一个问题，就是打完一行换行的时候，要用去0.2秒，正好可以打两个字符。要是在这0.2秒里面，又有新的字符传过来，那么这个字符将丢失。于是，研制人员想了个办法解决这个问题，就是在每行后面加两个表示结束的字符。一个叫做"回车"，告诉打字机把打印头定位在左边界；另一个叫做"

05

猴子意念打字，有可能敲出莎士比亚全集

“To be or notto be. That is the question.”这也是 Monkey J 使用大脑植入物控制计算机光标输入的文本。

02

Web Terminal 预备知识

几十年前，人们将 Teleprinter(电传打字机) 连接到早期的大型计算机上，作为输入和输出设备，将输入的数据发送到计算机，并打印出响应。

02

React实现打字机效果~

项目中有一个地方用到打字机的效果，并且在文字显示完成之后可以选择是否自动跳转到下一步骤。另外这个打字机效果在多个页面模块中使用，区别是打字完成后是否跳转。

02

[oeasy]python0040_换行与回车的不同_通用换行符_universal_newlines

换行回车回忆上次内容区分概念 terminal终端主机网络中最终的端点TeleTYpewriter 电传打印机终端硬件shell 终端硬件基础上的软件壳子Console 控制台主机旁边的控制面板存储文件的时候我在文件里打了回车\n系统将0x0a存入字节进文件换行自动就有回车功能了吗？🤔回忆一下被忽略的 \r\r \r 也是一个 ascii字符 \是转义字符\r是转义序列什么是转义呢？转义转义转化含义把原来两个字符 : \和r转化为 \r 这样一个字符没错

00

很少人真正了解 \n 和 \r 有什么区别！

在ASCII码中，我们会看到有一类不可显示的字符，叫控制字符，其中就包含\r 和 \n 等控制字符。

01

一文让你搞明白文本或代码中 \n 和 \r 的区别

在ASCII码中，我们会看到有一类不可显示的字符，叫控制字符，其中就包含\r 和 \n 等控制字符。

03

程序员的未来

程序员的未来在一个来自于CGP Grey很精彩的视频中，他提出说，在不久的将来，大多数工作将会由机器替代。许多行业，从卡车司机到医生，在不久的将来将会消失或发生巨大的变化，创造出一种全新的社会体制。但是，这样一来似乎有点说不通——既然未来的计算机程序将会大放光彩，那么势必需要更多的程序员。毕竟，创建自动汽车、自动化的医疗诊断系统、小贩机器人等等，都需要程序员的参与，不是吗？大错特错。编程是什么？编程是将理念（业务、法律、游戏、数学问题等）翻译成机器可以执行，其他人可以读取的代码的学科。归根结底，程序

07

Linux和Windows的换行符

一直对换行符这个东西概念比较模糊，直到最近花了一点时间仔细研究了一下，才彻底搞清楚这个问题，本文前面介绍部分是外文转载，后面例子是个人总结，希望能对大家有一些帮助。回车符号和换行符号产生背景关于“回车”（carriage return）和“换行”（line feed）这两个概念的来历和区别。在计算机还没有出现之前，有一种叫做电传打字机（Teletype Model 33）的玩意，每秒钟可以打10个字符。但是它有一个问题，就是打完一行换行的时候，要用去0.2秒，正好可以打两个字符。要是在这0.2秒里面，

07

总算搞清楚了回车和换行的来历与区别

总算搞清楚”回车”（carriage return）和”换行”（line feed）这两个概念的来历和区别了。在计算机还没有出现之前，有一种叫做电传打字机（Teletype Model 33）的玩意，每秒钟可以打10个字符。但是它有一个问题，就是打完一行换行的时候，要用去0.2秒，正好可以打两个字符。要是在这0.2秒里面，又有新的字符传过来，那么这个字符将丢失。于是，研制人员想了个办法解决这个问题，就是在每行后面加两个表示结束的字符。一个叫做”回车”，告诉打字机把打印头定位在左边界；另一个叫做”换行”

05

文本或代码中 \n 和 \r 的区别

在 ASCII 码中，我们会看到有一类不可显示的字符，叫控制字符，其中就包含\r 和 \n 等控制字符。

02

漫话：为什么键盘以QWER排列，而不是ABCD？

字母被敲击时，弹簧把这个字母对应的一根金属字杆弹到纸上，这样就印上了一个字。松开时，要靠弹簧把字杆弹回原位。

03

程序员的未来

原文出处： tcz.hu 译文出处：码农网 – 小峰程序员是注定灭绝的一个物种。在一个来自于CGP Grey很精彩的视频中，他提出说，在不久的将来，大多数工作将会由机器替代。许多行业，从卡车司机到医生，在不久的将来将会消失或发生巨大的变化，创造出一种全新的社会体制。但是，这样一来似乎有点说不通——既然未来的计算机程序将会大放光彩，那么势必需要更多的程序员。毕竟，创建自动汽车、自动化的医疗诊断系统、小贩机器人等等，都需要程序员的参与，不是吗？大错特错。编程是什么？编程是将理念（业务、法律、游

04

字符串匹配（多模式匹配篇）「建议收藏」

又称单词查找树，Trie树，是一种树形结构，是一种哈希树的变种。典型应用是用于统计，排序和保存大量的字符串（但不仅限于字符串），所以经常被搜索引擎系统用于文本词频统计。

04

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭