I found a randomizeList() JavaScript function. The following JavaScript code can randomize an HTML list. The script can handle both Ordered List (OL) and Unordered List (UL) because it works on the LI items which are common to both types of list. If you want to randomly display items in an HTML list every time the page loads you can calls the randomizeList() function when the onLoad event of the BODY tag occurs. And if you want to give control to the user, for example you want to randomize list on click of a button, then you can call the same function when onClick event of that button occurs. You would just need to pass the id of the list that you want to randomize. The ID should be defined in the first line of the randomizeList() function given below: Make sure that you replace the myItems in randomizeList() function with the ID of your HTML list. This method gets hold of all the nodes under the provided list. These nodes are the LI elements. Then it simply uses the rand() function of JavaScript to shuffle these LI elements and sent back a randomly arranged stack. As you can see from this example, being able to traverse Document Object Model (DOM) is essential to develop many web application. Although I am not using createTreeWalker() method here but it is really easy way to traverse DOM tree. I hope this tip was useful for you. Please let me know if you face any problem in this code. Thank you for using TechWelkin.

  1. I have a long list (165 urls) 2) I want to randomly show 15 of them in 3 columns ( no duplicates) Possible?? How?? Another Question: do you also program on WordPress/Woocommerce ? Comment * Name * Email * Website

Δ

Randomize HTML List  Display HTML List Items Randomly - 94