Question

我正在动态创建li元素：

$(data).find('slide').each(function(numSlide){
  var slideLink = $(this).attr('link');
  var slideimage = $(this).children('slideimage').text();
  var slidedesc = $(this).children('slidedesc').text();

  $('.slider ul').append('<li><a href="'+slideLink+'"><img src="'+root+"images/top-slider-image/"+slideimage+'" alt="welcome to Burger Davis Blog" /></a><div class="note">'+slidedesc+'</div></li>');
})

但是我想计算li的宽度，我需要应用一些风格 - 我该怎么做？如果我通过css方法添加样式，则它不适用于动态创建的元素......

请帮助我获取动态元素的宽度以及如何将样式应用到其中？

我知道我们可以使用live函数，但我无法理解......

Answer 1

$(data).find('slide').each(function(numSlide){
  var slideLink = $(this).attr('link');
  var slideimage = $(this).children('slideimage').text();
  var slidedesc = $(this).children('slidedesc').text();
  var li = $('<li><a href="'+slideLink+'"><img src="'+root+"images/top-slider-image/"+slideimage+'" alt="welcome to Burger Davis Blog" /></a><div class="note">'+slidedesc+'</div></li>');
  $('.slider ul').append(li);
  var w = li.outerWidth();
  li.css('width', w + 100);
})

这是一个人为的样本。在追加外部创建链接，以便您可以直接访问它，并使用innerWidth（）或outerWidth（）来获取宽度值。然后只需引用您创建的项目的css函数。在这个例子中，我只取当前宽度并为其添加100。

Answer 2

元素的宽度一旦添加到DOM，就是

element.offsetWidth

如何获得动态创建的元素宽度并应用样式？

2 个答案: