Javascript 在上面插入元素时保持滚动位置：仅在Safari中出现故障

我有一个HTML页面，其中包含了很多部分。这些节的内容被延迟加载。页面加载后，用户将滚动到某个特定部分。然后加载并插入节上方和下方的内容。显然，插入上面的内容会改变滚动位置，所以我需要保持相对于当前部分的滚动位置

我已经实现了一个最简单的解决方案，在Chrome、FF、Edge甚至IE11中都能完美地工作，但在Safari中，它有一些小故障

代码如下：

function insertElementAbove() {
  var elem;

  // load elem

  var prevOffset = window.pageYOffset;
  // insert element
  container.insertBefore(elem, container.firstChild);
  // measure inserter element height and adjust scroll pos
  var elemHeight = elem.offsetHeight;
  window.scrollTo(0, prevOffset + elemHeight);
}

我假设最后4行是同步运行的，因此根据浏览器渲染管道，在这两行之间不能进行重新绘制：

但在Safari中，有时在更换卷轴之前会进行绘制和合成。为什么只有Safari才会这样？这可能是因为Safari使用了

IOSurface

framework（）？有没有办法解决/解决这种行为

---

这是。

问题在iframe模式下不可再现，因此使用右上角的按钮转到“在单独窗口中预览”：

---

• Safari:

  10.0.1版（12602.2.14.0.7）

• macOS Sierra:

  10.12.1版