当前位置: 首页 > news >正文

js文字逐个显示

定时器每隔一段时间,替换文本内容,,substring 截取更多的字符串显示

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<div id="content"></div><script>let content = '足球是一项全球性的运动,它不仅是一项体育竞技,更是一种文化、一种生活方式。足球在世界范围内的影响力越来越大,成为了连接人们的纽带,也成为了国家间交流的重要方式。' +'<br>首先,足球是一项激烈的体育竞技,需要运动员们在球场上付出巨大的努力才能取得胜利。在足球比赛中,每个球员都需要充分发挥自己的技术和智慧,与队友共同完成进攻和防守的任务,才能够在比赛中取得胜利。这种团队合作的精神不仅让运动员们更好地理解合作和信任的重要性,也让他们更加珍视团队的荣誉和成就。' +'<br>其次,足球也是一种文化,它承载了许多国家和民族的文化和历史。足球比赛不仅仅是一场比赛,更是一种文化交流。在足球比赛中,球迷们会为自己喜欢的球队疯狂呐喊,为球队加油打气,这种热情和激情也成为了足球文化的重要组成部分。同时,足球也是一种跨越国界的文化,足球比赛将不同国家和民族的人们紧密联系在一起,促进了国际间的交流与合作。' +'<br>第三,足球也是一种生活方式。足球在许多国家和地区都成为了人们生活中的重要组成部分。在周末的时候,球迷们会聚集在一起观看比赛,共同享受足球的乐趣。足球也成为了一种生活方式,许多人会通过踢球来锻炼身体、缓解压力,还有一些人会通过足球来结交朋友、扩大社交圈。' +'<br>总之,足球不仅仅是一项体育运动,更是一种文化、一种生活方式。足球在全球范围内拥有广泛的影响力,它连接了人们的心灵,让人们更加接近,也更加理解彼此。足球不仅仅是一场比赛,更是一种精神,一种信仰,它让我们更加勇敢、坚定,更加热爱生活。';// 方法调用测试// addTxt('content', content);var box = document.querySelector("#content");let index = 0// function addTxt(){//   box.innerHTML = content.substring(0,index++)//   if (index > content.length){//     return//   }else{//     setTimeout(addTxt,50)//   }// }function addTxt(){let index = 0;let timer = setInterval(()=>{box.innerHTML = content.substring(0,index++)if (index >content.length){clearInterval(timer)}},50)}addTxt()</script></body>
</html>

引用:https://blog.csdn.net/onepiece1991/article/details/81386998

相关文章:

js文字逐个显示

定时器每隔一段时间&#xff0c;替换文本内容&#xff0c;&#xff0c;substring 截取更多的字符串显示 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>Title</title> </head> <body…...

电子沙盘数字沙盘大数据人工智能开发教程第16课

电子沙盘数字沙盘大数据可视化GIS系统开发教程第16课&#xff1a;新增加属性在MTGIS3d控件 public bool ShowFLGrid;//是否显 示方里网格。 public bool Atmosphere;//是否显示大气圈。&#xff08;因为WPF不支持shader功能&#xff0c;所以效果嘛。。。&#xff09; 在SDK中为…...

dockerfile lnmp 搭建wordpress、docker-compose搭建wordpress

-----------------安装 Docker--------------------------- 目前 Docker 只能支持 64 位系统。systemctl stop firewalld.service setenforce 0#安装依赖包 yum install -y yum-utils device-mapper-persistent-data lvm2 --------------------------------------------------…...

手写模拟SpringBoot核心流程

通过手写模拟实现一个Spring Boot&#xff0c;让大家能以非常简单的方式就能知道Spring Boot大概是如何工作的。 依赖 建一个工程&#xff0c;两个Module: 1.springboot模块&#xff0c;表示springboot框架的源码实现 2.user包&#xff0c;表示用户业务系统&#xff0c;用来写…...

怒刷LeetCode的第26天(Java版)

第一题 题目来源 64. 最小路径和 - 力扣&#xff08;LeetCode&#xff09; 题目内容 解决方法 方法一&#xff1a;动态规划 可以使用动态规划来解决这个问题。 首先创建一个与网格大小相同的二维数组dp&#xff0c;用于存储从起点到每个位置的最小路径和。然后初始化dp[0…...

Linux文件基本权限

一、Linux权限 简介 在Linux系统中,每个文件和目录都有读(r),写(w)和执行(x)权限,这些权限决定了用户对该文件或目录的访问方式。Linux服务器上有严格的权限等级,如果权限过高导致误操作会增加服务器的风险。文件权限 只有root用户和文件拥有者才可以修改文件访问权…...

Unity设计模式——装饰模式

装饰模式&#xff08;Decorator&#xff09;&#xff0c;动态地给一个对象添加一些额外的职责&#xff0c;就增加功能来说&#xff0c;装饰模式比生成子类更为灵活。 Component类&#xff1a; abstract class Component : MonoBehaviour {public abstract void Operation(); …...

Http请求响应 Ajax 过滤器

10/10/2023 近期总结&#xff1a; 最近学的后端部署&#xff0c;web服务器运行&#xff0c;各种请求响应&#xff0c;内容很多&#xff0c;学的很乱&#xff0c;还是需要好好整理&#xff0c;前面JavaSE内容还没有完全掌握&#xff0c;再加上一边刷题&#xff0c;感觉压力很大哈…...

【Qt控件之QTableWidget】使用及技巧

简介 QTableWidget是Qt中的表格控件&#xff0c;用于显示和编辑二维表格数据&#xff0c;QTableView类的子类。 可以和定时器结合&#xff0c;实现定时刷新表格中的数据或执行其他与表格相关的操作。 主要函数说明 定时器相关函数(用于刷新表格数据)&#xff1a; void startT…...

算法-动态规划/中心扩散法-最长回文子串

算法-动态规划/中心扩散法-最长回文子串 1 题目概述 1.1 题目出处 https://leetcode.cn/problems/longest-palindromic-substring 1.2 题目描述 2 动态规划 2.1 思路 dp[i][j] 表示[i,j]之间的字符串是否是回文。 那么&#xff0c;如果chars[i] chars[j]时&#xff0c;就…...

(6)SpringMVC中使用CharacterEncodingFilter编码过滤器处理请求和响应的乱码问题

处理SpringMVC中乱码问题 处理原生Servlet中请求和响应的乱码问题,参考文章 Servlet中的过滤器的实现及其原理,参考文章 配置CharacterEncodingFilter 在Servlet规范中要求request和response对象设置编码之前不能有获取请求参数和响应数据的操作,否则后续设置的编码都将不起…...

USB协议层数据格式

USB协议 1. 硬件拓扑结构2. 协议层2.1 字节/位传输顺序2.2 SYNC域2.3 包格式2.3.1 PID域2.3.2 令牌包(Token)2.3.3 数据包2.3.4 握手包 2.4 传输细节2.4.1 传输(Transfer)和事务(Transaction)2.4.2 过程(stage)和阶段(phase)2.4.3 批量传输2.4.4 中断传输2.4.5 实时传输2.4.6 控…...

加密的重要性,MySQL加密有哪些好处?

加密是一种将信息转化为无法直接读取的格式的技术&#xff0c;从而保护信息安全。在当今数字化的世界中&#xff0c;数据已成为企业的重要资产&#xff0c;因此加密的重要性不言而喻。在这篇文章中&#xff0c;我们将探讨MySQL加密的好处以及如何选择合适的加密算法。 MySQL加密…...

Python为Excel中每一个单元格计算其在多个文件中的平均值

本文介绍基于Python语言&#xff0c;对大量不同的Excel文件加以跨文件、逐单元格平均值计算的方法。 首先&#xff0c;我们来明确一下本文的具体需求。现有一个文件夹&#xff0c;其中有如下所示的大量Excel文件&#xff0c;我们这里就以.csv文件为例来介绍。其中&#xff0c;每…...

LLM 系列之 Transformer 组件总结

本系列为LLM 学习博客&#xff0c;会一一记录各个模块解读。 以下内容参考:大语言模型综述 https://github.com/RUCAIBox/LLMSurvey 主流架构 大语言模型&#xff0c;主要的核心组件是Transformer。不同的模型选择的架构不一样&#xff0c;目前主流架构有&#xff1a; 编码器…...

计算机等级考试—信息安全三级真题十

目录 一、单选题 二、填空题 三、综合题 一、单选题...

面试总结(mysql定精度/oom排查/spring三级缓存/stream流)

Mysql数据类型上的一个把握 1、MySQL Decimal为什么不会丢失精度 DECIMAL的存储方式和其他数据类型都不同&#xff0c;它是以字符串形式存储的。假设一个字段为DECIMAL(3,0)&#xff0c;当我们存入100时&#xff0c;实际上存入的1、0、0这三个字符拼接而成的字符串的二进制值&…...

uniapp四个元素点击那个哪个变色,其他的还变原来的颜色

在UniApp中&#xff0c;可以使用CSS伪类选择器和动态样式绑定来实现点击某个元素时改变其颜色的效果。假设有四个元素分别为A、B、C和D。 首先&#xff0c;为这四个元素添加一个共同的类名&#xff0c;例如"item"。 然后&#xff0c;在页面的样式中定义两种颜色&am…...

Springcloud笔记(2)-Eureka服务注册

Eureka服务注册 服务注册&#xff0c;发现。 在Spring Cloud框架中&#xff0c;Eureka的核心作用是服务的注册和发现&#xff0c;并实现服务治理。 Eureka包含两个组件&#xff1a;Eureka Server和Eureka Client。 Eureka Server提供服务注册服务&#xff0c;各个节点启动后…...

国庆 day 5

QT实现TCP服务器客户端搭建的代码&#xff0c;现象 服务器 #include "widget.h" #include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget) {ui->setupUi(this);server new QTcpServer(this);connect (server,&…...

单调栈:高效解决边界查找问题

一、上期回顾 学完并查集 DSU&#xff1a;初始化、查找、合并、路径压缩&#xff0c;连通块、集合合并类题目直接秒杀。今天攻坚单调栈&#xff0c;属于刷题必备、面试常问的线性时间算法。二、单调栈核心概念1. 什么是单调栈栈内元素保持严格递增 / 严格递减&#xff0c;始终维…...

Hive 数据库 增删改 完整操作指南

Hive 是基于 Hadoop 的数据仓库&#xff0c;不支持传统数据库的行级事务&#xff08;标准 Hive&#xff09;&#xff0c;核心用于离线数据分析。Hive 对数据库&#xff08;Database&#xff09; 的操作只有 CREATE&#xff08;增&#xff09;、DROP&#xff08;删&#xff09;、…...

测试RPA自动化发布-FastAPI实战

# FastAPI 简介这是一篇通过 Playwright 自动发布的测试文章。我们的代码正在测试中......

3种实战方法深度解析:如何高效使用TrollInstallerX安装TrollStore越狱工具

3种实战方法深度解析&#xff1a;如何高效使用TrollInstallerX安装TrollStore越狱工具 【免费下载链接】TrollInstallerX A TrollStore installer for iOS 14.0 - 16.6.1 项目地址: https://gitcode.com/gh_mirrors/tr/TrollInstallerX TrollInstallerX是一款专为iOS 14…...

巨头转身难的地方,我们的星辰大海:开发版机巢,为千行百业而生

未来的低空经济图景是怎样的&#xff1f;它绝不仅仅是几架无人机在天上飞。 未来的城市与能源基础设施中&#xff0c;将隐藏着无数形态各异、能力专精的“机巢”。它们将像毛细血管一样渗透在城市的各个角落&#xff0c;定时自动穿梭&#xff0c;替代人力进行精细化巡检&#x…...

五分钟完成python脚本对接taotoken多模型api的教程

&#x1f680; 告别海外账号与网络限制&#xff01;稳定直连全球优质大模型&#xff0c;限时半价接入中。 &#x1f449; 点击领取海量免费额度 五分钟完成Python脚本对接Taotoken多模型API的教程 对于希望快速接入多个主流大模型的Python开发者而言&#xff0c;Taotoken提供的…...

Windows Cleaner:解决C盘爆红问题的3个高效方法

Windows Cleaner&#xff1a;解决C盘爆红问题的3个高效方法 【免费下载链接】WindowsCleaner Windows Cleaner——专治C盘爆红及各种不服&#xff01; 项目地址: https://gitcode.com/gh_mirrors/wi/WindowsCleaner 当您的Windows电脑C盘突然变红&#xff0c;可用空间告…...

如何5分钟掌握Ketcher:化学绘图从零到精通的完整指南

如何5分钟掌握Ketcher&#xff1a;化学绘图从零到精通的完整指南 【免费下载链接】ketcher Web-based molecule sketcher 项目地址: https://gitcode.com/gh_mirrors/ke/ketcher 你是否经常为绘制复杂的化学结构而烦恼&#xff1f;面对论文投稿、实验报告或教学演示时&a…...

3大核心功能揭秘:如何用SMUDebugTool深度掌控AMD Ryzen处理器性能

3大核心功能揭秘&#xff1a;如何用SMUDebugTool深度掌控AMD Ryzen处理器性能 【免费下载链接】SMUDebugTool A dedicated tool to help write/read various parameters of Ryzen-based systems, such as manual overclock, SMU, PCI, CPUID, MSR and Power Table. 项目地址:…...

别再只盯着JWT了!手把手教你用Python解密JWE Token(附完整代码)

深入实战&#xff1a;用Python解密JWE Token的全流程指南 在当今的Web应用开发中&#xff0c;Token已成为身份验证和授权的主流方式。大多数开发者对JWT&#xff08;JSON Web Token&#xff09;已经相当熟悉&#xff0c;能够轻松地在jwt.io等工具上解码和验证。然而&#xff0c…...