javaScript 利用随机数和定时器完成几个有用的文字小操作 文字的滚动效果，文字的打印效果和文字的颜色闪烁
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了javaScript 利用随机数和定时器完成几个有用的文字小操作 文字的滚动效果，文字的打印效果和文字的颜色闪烁相关的知识，希望对你有一定的参考价值。
文字的滚动
<body>
<textarea id="textarea"></textarea>
<script>
str=" 文 字 的 滚 动 效 果";
function roll(){
str=str.substr(1,str.length)+str.substring(0,1);
document.getElementById("textarea").style.fontSize="20px";
document.getElementById("textarea").innerText=str;
}
setInterval(roll,200);
</script>
</body>
文字的打印
<body>
<textarea id="textarea"></textarea>
<script>
var str="文字的打印效果";
var index=0;
function type() {
if(index == str.length+1) {
index = 0;
}
document.getElementById("textarea").style.fontSize="15px";
document.getElementById("textarea").innerText = str.substring(0, index++);
}
setInterval(type, 500);
</script>
</body>
文字的颜色闪烁
<body>
<span id="s1">文</span>
<span id="s2">字</span>
<span id="s3">的</span>
<span id="s4">颜</span>
<span id="s5">色</span>
<span id="s6">闪</span>
<span id="s7">烁</span>
<script>
str="文字的颜色闪烁";
function color(){
r=Math.floor(Math.random()*256);
g=Math.floor(Math.random()*256);
b=Math.floor(Math.random()*256);
return "rgb("+r+","+g+","+b+")"
}
function word(){
document.getElementById("s1").style.color=color();
document.getElementById("s2").style.color=color();
document.getElementById("s3").style.color=color();
document.getElementById("s4").style.color=color();
document.getElementById("s5").style.color=color();
document.getElementById("s6").style.color=color();
document.getElementById("s7").style.color=color();
}
setInterval(word,500);
</script>
</body>
以上是关于javaScript 利用随机数和定时器完成几个有用的文字小操作 文字的滚动效果，文字的打印效果和文字的颜色闪烁的主要内容，如果未能解决你的问题，请参考以下文章