javascript - 使用 JavaScript 获取 Flexbox 元素之间的空间

Question

是否可以使用 JavaScript 在 Flexbox 中使用 justify-content: space- Between 获取两个元素之间的间距？

Answer 1

这是可能的。 Example

function calcSpaceBetween(){
  var red_pos = $('#d1').position().left + $('#d1').width();
  var blu_pos = $('#d2').position().left;

  var space = blu_pos - red_pos;

  $('#space').text(space + ' px')
}

1. 计算左边的位置(红色)+它的宽度

2. 找到正确的位置(蓝色)

3. (蓝色.位置)-(红色)+(红色.宽度)