js 实现的打字效果（参考网络）

最新推荐文章于 2024-04-06 09:46:47 发布

继续去踢波

最新推荐文章于 2024-04-06 09:46:47 发布

阅读量2.2k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： JS

本文链接：https://blog.youkuaiyun.com/LOW584710047/article/details/46672279

JS 专栏收录该内容

23 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现的动态打字效果。通过逐字符显示字符串并模拟光标闪烁，创造出正在输入文本的视觉效果。该方法适用于网页中添加趣味性的文字展示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>

<html>
	<head>
		<meta charset='utf-8'>
		<title>js typing</title>
	</head>

	<body>
		<div id='divTyping'></div>

		<script>
			var str = 'js 实现的 打字效果，感觉蛮有趣的。';
			var i = 0;

			function typing(){
				var divTyping = document.getElementById('divTyping');
				if (i <= str.length) {
					divTyping.innerHTML = str.slice(0, i++) + '_';
					setTimeout('typing()', 200);//递归调用
				}
				else{
					divTyping.innerHTML = str;//结束打字,移除 _ 光标
				}
			}

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