[Faab]

Учебное задание: сгенерировать облако тэгов, которые лежат в массиве в div c id="tagContainer". Генерация расположения тэгов должна протекать по произвольным значениям ширины и высоты дива tagContainer. Есть ещё ньансы - слова не должны накладываться друг на друга, не должны выходить за рамки дива и тд.

Первое: я решил узнать размеры элемента, которое я создам и с этими значениями можно будет уложиться в задание. Но как узнать размер в пикселях элемента созданного span? Ведь я буду каждому span давать свой размер шрифта.

Попробовал так, но разумеется выходит undefined, так это же не объект изображения.

window.onload = function(){

  var mainContainer = document.getElementById("tagContainer");
  var eSpan01 = document.createElement("span");
  var sText01 = "Word1";
  var eTextNode01 = document.createTextNode(sText01);
  eSpan01.appendChild(eTextNode01);
  
  mainContainer.appendChild(eSpan01);
  alert(eSpan01.width); // undefined
};