Swipe Points Using JavaScript


 Effect diagram of javascript brushing credits

Use JS to brush points, mainly use the timer loop to perform the accumulation of points.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>刷积分</title>
</head>
<body>
    <p>今天刷了<span>1</span>积分</p>
    <ul></ul>

The html content is mainly used for the text display of earning points.

The ul tag is mainly for adding li tags to the ul tag in js later.


    <script>
        var ul = document.querySelector('ul');
     var span = document.querySelector('span');
     var num = 1;
    

Get the elements in html, and num is defined for the accumulation of points later.


     setInterval(time,1000);
     function time(){
       var date = new Date().toLocaleString();
       var li = document.createElement('li');
       

setInterval: It is used to define the loop timer, time calls the following function, 1000 means that it is executed every 1000 milliseconds (1000 milliseconds = 1 second).

new Date gets the current time, toLocaleString: an expression of the current time.

createElement("li"): means to create a li node.


        li.innerText = "时间" + date +' '+ 1 + "积分";
        ul.appendChild(li);
        span.innerText = num;
        num++; 
     }
    </script>
</body>
</html>

li.innerText: Modify its text content in the li element.

appendChild(li): Add the content modified in li.innerText to the inner element.

span.innerText and num++: Mainly record the number of integrations.

Guess you like

Origin blog.csdn.net/qq_65715980/article/details/125603941