Медленная загрузка JavaScript, код кажется очень большим?

Question

Так вот мой код

function listview() {

   //li list//
   var li = document.getElementById("sortcontainer").
getElementsByClassName("game");


for(var i = 0; i < li.length; i) {
   li[i].className = "lilistview";
   }

   //li image list//
   var img = document.getElementById("sortcontainer").
   getElementsByClassName("image");
for(var j = 0; j < img.length; j) {
   img[j].className = "imglistview";
   }   

     //header list//
   var header1 = document.getElementById("sortcontainer").
   getElementsByClassName("title");
   var header2 = document.getElementById("sortcontainer").
   getElementsByClassName("date");
   var header3 = document.getElementById("sortcontainer").
   getElementsByClassName("thumbrating");
for(var k = 0; k < header1.length; k) {
   header1[k].className = "listviewchildren";
   } 
for(var l = 0; l < header2.length; l) {
   header2[l].className = "listviewchildren";
   } 
for(var m = 0; m < header3.length; m) {
   header3[m].className = "listviewchildren";
   }

}  

В основном он использует один и тот же код снова и снова, чтобы изменить вид миниатюры на вид списка, но код кажется таким длинным, и его медленное изменение из двух.

Есть предложения?

Answer 1

РЕДАКТИРОВАТЬ: я переделал все это, подумав об этом на ночь.
1) Это больше для меня, чем для тебя.
2) Вы меняете ClassNames, верно?
3) Получить var sortcontainer = .. один раз вместо 5 раз.
4) цикл for (var i = 0; i

5) Одна подпрограмма будет обрабатывать все 5 наборов элементов.
6) Страница должна быть загружена.

window.onload = function() {
  var sortcontainer = document.getElementById("sortcontainer"); // used many times
  listview();
}
function listview() {
  changeClass("game", "lilistview");
  changeClass("image", "imglistview");
  changeClass("title", "listviewchildren");
  changeClass("date", "listviewchildren");
  changeClass("thumbrating", "listviewchildren");
}
function changeClass(oldClassName, newClassName) {
  var elementsByClass = sortcontainer.getElementsByClassName(oldClassName);
  console.log("-- " + oldClassName + " -- " + newClassName + " --");
  console.log("changing " + elementsByClass.length + " classnames");
  for (i=0; i<elementsByClass.length; i+=1) {
    elementsByClass[i].className = newClassName); }
}