简单的jQuery算法

Question

从理论上讲，如果我有一个无序项目的列表

<ul>
    <li><a>Link1</a></li>
    <li><a>Link1</a></li>
</ul>

我怎样才能用jQuery做以下事情？

1)找到每个单独a元素的宽度

2)找出每个li元素的宽度

3)从父a元素的宽度中减去每个子li元素的宽度

4)然后将总和添加到每个父li元素

这不起作用：

$('ul > li').each(function() {
  var liWidth = (this).width();
  var aWidth = ('ul > li > a').width();
  var subractedWidth = parseFloat(liWidth) - parseFloat(aWidth);
  var newWidth = subtractedWidth + parseFloat(liWidth);
  $(this).css('width',newWidth);  
});

提前感谢！

Answer 1

您在一些地方忘记了使用$，并且您正在尝试获取在您所在的特定<li>内的<a>宽度，因此您不应该重新查询整个DOM。这样就可以了：

$('ul > li').each(function() {
    var liWidth = parseFloat($(this).width());
    var aWidth = parseFloat($(this).find('a').eq(0).width());
    $(this).width((liWidth - aWidth) + liWidth);
});

Answer 2

你可以这样做

$('ul > li > a').each(function () {
    var li = $(this).closest('li'), 
        liWidth = li.width(),
        aWidth = $(this).width();

    li.width(liWidth + (liWidth - aWidth));
});

Answer 3

看来你忘了带$了。

$('ul > li').each(function() {
  var liWidth = $(this).width();
  var aWidth = $(this).find('a').width();
  var subractedWidth = parseFloat(liWidth) - parseFloat(aWidth);
  var newWidth = subtractedWidth + parseFloat(liWidth);
  $(this).css('width',newWidth);  
});