js實現網頁標簽內容的自刪自增
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<span id="s1"></span>
<span style="color:red;">|</span>
<body>
</body>
<script type="text/javascript">
var s=document
var str="hello world";//初始標簽內容
var st1="wellcome to beijing";
var st2="that sounds good";
var st3="what‘ your name";
s.innerHTML=str;//初始化標簽內容
change=0;//增刪控制器,當其值為0時執行刪函數,其值為1時執行增函數
function del(){
str=str.split("");
if(str.length
str.pop();
str=str.join("");
s.innerHTML=str;//一直用str覆蓋span標簽的原內容
}
if(str.length==0){
change=1;//change==1時main函數判斷後會執行增加函數
}
}
var i=0;//i是待插入的字符串數組的下標
var z=0;//z是add參數選擇器,0是第一個,1是第二個,2是第三個
function add(st1,st2,str3){
str
var str2=arguments[z];//定義了用於函數add接收參數的變量str2
if(str.length<str2.length){
str.push(str2[i]);
i++;
str=str.join("");
s.innerHTML=str;
}
if(str.length==str2.length){
change=0;//change==0時,在main函數判斷後會執行刪除函數
i=0;//一個字符串加完了,將下標清零,等待下一次加載
if(z<2){
z++;
}
else{
z=0;
}
}
}
function main(){
if(change==0){
del();//減字
}
else{
add(st1,st2,st3);//加字
}
setTimeout(function(){main()},200);
}
main()
</script>
</html>
<script type="text/javascript">
var s=document.getElementById("s1");//獲取span標簽
var str="hello world";//初始標簽內容
var st1="wellcome to beijing";
var st2="that sounds good";
var st3="what‘ your name";
s.innerHTML=str;//初始化標簽內容
change=0;//增刪控制器,當其值為0時執行刪函數,其值為1時執行增函數
function del(){
str=str.split("");
if(str.length>=0){
str.pop();
str=str.join("");
s.innerHTML=str;//一直用str覆蓋span標簽的原內容
}
if(str.length==0){
change=1;//change==1時main函數判斷後會執行增加函數
}
}
var i=0;//i是待插入的字符串數組的下標
var z=0;//z是add參數選擇器,0是第一個,1是第二個,2是第三個
function add(st1,st2,str3){
str=str.split("");
var str2=arguments[z];//定義了用於函數add接收參數的變量str2
if(str.length<str2.length){
str.push(str2[i]);
i++;
str=str.join("");
s.innerHTML=str;
}
if(str.length==str2.length){
change=0;//change==0時,在main函數判斷後會執行刪除函數
i=0;//一個字符串加完了,將下標清零,等待下一次加載
if(z<2){
z++;
}
else{
z=0;
}
}
}
function main(){
if(change==0){
del();//減字
}
else{
add(st1,st2,st3);//加字
}
setTimeout(function(){main()},200);
}
main()
</script>
js實現網頁標簽內容的自刪自增