jquery - 简单的 jQuery 算法

Question

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

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

我怎么能用 jQuery 做以下事情？

a1）找到每个单独元素的宽度

li2）找到每个单独元素的宽度

a3）从其父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

您忘记$在几个地方使用 ，并且您正在尝试获取您所在<a>的特定范围内的宽度<li>，因此您不应该重新查询整个 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);  
});