javascript - 我将如何编写一个变量来使用 Jquery 调用页面上所有元素的所有边距？

Question

标题几乎说明了一切，我不知道这是基本还是高级，但我需要一个变量，它将是页面上每个有边距的元素的所有顶部和底部边距的总和。我不需要左边或右边的。这可以轻松完成吗？

Answer 1

试试这个：

function sumMargins() {
    var total = 0;
    $("*").each(function() {
        var top = parseInt($(this).css("marginTop"));
        var bottom = parseInt($(this).css("marginBottom"));
        total += (top + bottom);
    });
    return total;
}

看到这个小提琴。

Answer 2

var x = 0;

$('*').each(function() {
    x += parseInt($(this).css('margin-top'));
    x += parseInt($(this).css('margin-bottom'));
});

alert(x);

Answer 3

这是一个工作小提琴：

http://jsfiddle.net/jonigiuro/qQ6sB/

function allMargins() {
    var total = 0;
    $('.container *').each(function(i) {
        var currentTop = parseInt($(this).css('margin-top'));
        var currentBottom = parseInt($(this).css('margin-bottom'));
        total = total + currentTop + currentBottom;
    });
    return total;
}

alert('The total of the margins is: ' + allMargins());

我添加了一个 .container div 来限制 * 选择器，否则它还会包含 html 和 body 标签，它们的边距不一致（我有 8 个像素）。

上面的解决方案更快，但这更可靠。