WEB前端-HTML-JavaScript实现内容滚动刷新的效果

    xiaoxiao2025-06-15  15

    给大家分享一个简要的内容滚动刷新的小实例,只要通过JavaScript的字符串操作来实现,并通过setInterval方法实现无线循环,具体扩展使用,请自行挖掘。 这里注意一点:我将< script>标签放在了body的最下面中,这样为了先加载页面内容,在加载script,避免页面内容还没显示,先执行script而引起的访问等待,这是一个小细节,仁者见仁,仅供参考。 代码如下:

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>demo</title> </head> <body> <h1 id="i1" style="display:inline-block;background-color:hotpink;color:black">宝宝不哭...宝强做得对...我们永远支持你...</h1> <script> function f1(){ // var i = 123; i = 123; } function f2(){ // js获取某一个标签 id=il var tag = document.getElementById("i1"); // 获取标签的内容 var text = tag.innerText; var a = text.charAt(0) var sub = text.substring(1,text.length); // 拼接字符串 var data = new Date; var data_now = data.getDate() var new_str = sub + a; // 重新复制 tag.innerText = new_str; } // 相当于封装了一个while 循环,第一个参数为执行的内容,第二个参数为停顿时间,单位为ms setInterval("f2()",500); </script> </body> </html>

    实现效果如下:

    转载请注明原文地址: https://ju.6miu.com/read-1299956.html
    最新回复(0)