javascript / jquery - 如何获取尚未添加到dom的元素/ css类的宽度

Question

I'm trying to dynamically find the width of an item which will have a css class with a specific width, in order to dynamically position its background image (a sprite). However, the item has not yet been added to the DOM. Is there a way to read a class's width property before it's added to the DOM?

Answer 1

I believe you cant. Instead add it to a test div,find the width and then remove the div.

   $selector.append("<div id='test'></div>");
   var widthVal= $selector.find("#test").width();
       $("#test").remove();

selector is the element selector you may want to append to. You can associate a class with the "test" div, to have it as "display:none"

Answer 2

This is a Little Hackie but it should work. Add it to the DOM with the CSS Attribute display: none so it will be invisible then you can read the with property and delete the element if need be after. Or change its state from Display:none.

Hope this helped.