Получение точных размеров для вновь созданного объекта DOM

Question

Я создаю элементы DOM динамически (точнее, использую jQuery для создания DIV, содержащего некоторый текст с css "width: auto", и использую шрифт "font-face" в событии OnLoad страницы), но нахожу, чтоширина div не является ожидаемым размером (в частности, ширина неверна) сразу после того, как я его создаю и добавляю в дерево DOM.Мне нужно знать ширину / высоту элемента, потому что я буду делать динамический макет для него.

В качестве обходного пути я использую следующий код после создания элементов:

SetTimeout (complete_layout, 100)

Благодаря задержке завершения моего макета с этим дополнительным тайм-аутом все работает идеально, все размеры элементов соответствуют ожиданиям (в последней версии Chrome для Ubuntu Linux)

Однако эта задержка таймера Клугея оскорбляет мою чувствительность и явно небезопасна ... Есть ли способ заставить точные вычисления размеров с помощью конкретной команды?Или я могу зарегистрировать событие, которое сработает только после правильного размера всех элементов DOM после создания новых динамических элементов?(Я представляю что-то вроде события загрузки IMG, которое позволяет вам определить правильные размеры изображения после его загрузки)

tl; dr : есть ли гарантия каккогда ширина вновь созданного объекта DOM будет точной?

Спасибо за помощь!

Answer 1

Как вы пытаетесь получить ширину? .css ("ширина") или .width (),

Вы должны использовать .width (), так как .css ("width") не вернет ничего, кроме auto (если ширина не была указана в каком-либо стиле)

$("#foo").width();

Он должен давать ширину даже после немедленного добавления.

Answer 2

Вы можете получить ширину, получив ширину элемента, к которому вы добавляете новый div. Поскольку ширина нового div установлена ​​на auto, они должны быть одинаковыми.

Это, однако, не будет работать для высоты.