How to Implement the countdown Effect of flash sales using the javascript time sorting algorithm _ javascript skills

This article mainly introduces how the javascript time sorting algorithm achieves the countdown Effect of flash sales, that is, multiple countdown sorting on one page, if you are interested, you can refer to the time required for creating a second kill list page on an activity page. It takes some time for you to sort the algorithms and you have thought about the algorithms for a long time, later, I asked my php student in the next background that he wrote an algorithm for me. At the beginning, I thought this was a pure algorithm and could not be converted into a page dom effect, but I can see it again twice, so I changed it and realized it. I will share it with you first.

The page requirement is: From to, a second spike is performed every hour. If the current time is used, the products before the second kill are displayed, and so on.

Similar to the first 11-point order11,12, 13,14, 15,16, 17,18, 19,20 (point );
The order from to is)
The order from to is)
.....
The final order is20, 19, 18, 17, 16, 15, 13, 12, 11 (point)

This is the pure algorithm of the background student.

Function show_test (hour) {p = ['13 dian ', '14 dian', '15 dian ', '16 dian', '17 dian ', '18 dian ', '19dian', '20dian']; console. log ('original order is '); console. log (p); date = new Date (); curHour = date. getHours (); pos = curHour-13; // pos = hour; s = 'active' + p [pos] + "in progress"; console. log (s); desc = 'current order should be '; p. reverse (); console. log (pos); tmp = [] for (I = 0; I
 
  

  
Call

  

  
var curHour=new Date().getHours();show_test(curHour);
  

  
The requirements required for the perfect implementation of this algorithm are expressed, but the question is, how can we truly convert it into a page? So after thinking about it, I will implement it perfectly;

  

  
// First define an array of IDs and images containing each second kill. img1 is the product image. img2 is the second kill time. img3 is the product description var data = [{id: 1, time: 11, img1: "1.jpg", img2:" 11.jpg", img3: "111.jpg"}, {id: 2, time: 12, img1:" 2.jpg", img2: "22.jpg", img3: "222.jpg"}, {id: 3, time: 13, img1:" 3.jpg", img2: "33.jpg", img3:" 333.jpg"}, {id: 4, time: 14, img1: "4.jpg", img2:" 44.jpg", img3: "444.jpg"}, {id: 5, time: 15, img1:" 5.jpg", img2: "55.jpg", img3:" 555.jpg "}, {id: 6, time: 16, img1: "6.jpg", img2:" 66.jpg", img3: "666.jpg"}, {id: 7, time: 17, img1:" 7.jpg ", img2: "77.jpg", img3:" 777.jpg"}, {id: 8, time: 18, img1: "8.jpg", img2:" 88.jpg", img3: "888.jpg"}, {id: 9, time: 19, img1: "9.jpg", img2:" 99.jpg", img3: "999.jpg"}, {id: 10, time: 20, img1:" 10.jpg", img2: "101.jpg", img3:" 1010.jpg"}]; // object array sorting function compare (propertyName) {return function (object1, object2) {var value1 = object1 [propertyName]; var value2 = object2 [propertyName]; if (value2 <value1) {return-1;} else if (value2> value1) {return 1;} else {return 0 ;}}} // because the current array has become a complex array, the sorting method is used to sort objects based on a certain attribute. // function itemShow is mentioned in the javascript advanced programming. (hour) {p = data; // current time curHour = hour; // array subscript pos = curHour-11 for the corresponding time; if (pos <= 0) {// if the first order pos = 0 is displayed before;} else if (pos> = 9) {// if the value exceeds 20, pos = 9} s = 'activity' + p [pos] + "in progress"; console. log (s); // sort p in reverse order based on the time attribute in the array. reverse (compare ("time"); console. log (pos); console. log (p); // defines a temporary array to store obsolete item tmp = [] for (I = 0; I
   
    

    
In this way, the algorithm is displayed on the page. I hope you can understand the javascript time sorting algorithm.