1. 程式人生 > >js實現網頁標簽內容的自刪自增

js實現網頁標簽內容的自刪自增

char join font split world utf size hello san

<!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

.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==1main函數判斷後會執行增加函數

}

}

var i=0;//i是待插入的字符串數組的下標

var z=0;//zadd參數選擇器,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>

</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==1main函數判斷後會執行增加函數

}

}

var i=0;//i是待插入的字符串數組的下標

var z=0;//zadd參數選擇器,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實現網頁標簽內容的自刪自增