- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title></title>
- <meta name="renderer" content="webkit">
- <meta http-equiv="X-UA-Compatible" content="IE=Edge">
- <meta name="keyword" content="">
- <meta name="description" content="">
- </head>
- <body>
- <div class="autotype" id="autotype">
- <p>一场雨把我困在这里</p>
- <br/>
- <p>你温柔的表情</p>
- <p>会让我伤心</p>
- <br/>
- <p>六月的雨,只是无情的你~</p>
- </div>
- <script src="http://file2.ci123.com/ast/js/jquery_172.js"></script>
- <script>
- $.fn.autotype = function(){
- var $text = $(this);
- console.log('this',this);
-
- var str = $text.html();//返回被选 元素的内容
-
- var index = 0;
- var x = $text.html('');
- //$text.html()和$(this).html('')有区别
-
- var timer = setInterval(function(){
- //substr(index, 1) 方法在字符串中抽取从index下标开始的一个的字符
- var current = str.substr(index, 1);
-
- if(current == '<'){
- //indexOf() 方法返回">"在字符串中首次出现的位置。
- index = str.indexOf('>', index) + 1;
- }else{
- index ++ ;
- }
-
- //console.log(["0到index下标下的字符",str.substring(0, index)],["符号",index & 1 ? '_': '']);
- //substring() 方法用于提取字符串中介于两个指定下标之间的字符
- $text.html(str.substring(0, index) + (index & 1 ? '_': ''));
- if(index >= str.length){
- clearInterval(timer);
- }
- },100);
- };
-
- $("#autotype").autotype();
- </script>
- </body>
- </html>
复制代码
|