跑马灯 

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6     <style>
 7         h1{
 8             background-color: black;
 9             color:red;
10             text-align: center;
11             line-height: 50px;
12         }
13     </style>
14 </head>
15 <body>
16 <h1 class="title">欢迎总莅临我公司检查指导工作</h1>
17 <button onclick="test()">click</button>
18 <script>
19     function test() {
20         var ele=document.getElementsByClassName("title")[0];
21     // console.log(ele.innerText);
22     // console.log(typeof ele.innerText);
23         var content=ele.innerText;
24         var fist_char=content.charAt(0);
25         var later_string=content.substring(1,content.length);
26         var new_content=later_string+fist_char;
27     //赋值操作
28         ele.innerText=new_content;
29     }
30 
31     setInterval(test,1000);
32 
33 </script>
34 </body>
35 </html>

 

posted @ 2018-01-09 16:17  南城思念，北城等待  阅读(137)  评论(0)    收藏  举报