Javascript 如何将子节点添加到父节点，而不让视图跳转到加载元素的位置？

当我渲染元素并将它们附加到父div时，我的屏幕在加载时一直跳到最底部的元素，而不是加载它们并使视图保持在当前视图中。因此，在开始时，它应该在屏幕的顶部，并停留在那里，而不是跳到底部。当我向下滚动，它呈现更多的元素时，它也应该停留在该点，而其余的则加载

下面是我的js文件中的代码

function loadMultipleElements(amountToLoad, url) {
    var parentDiv = document.getElementById("instance");
    for(var i = 0; i < amountToLoad; i++) {
        var iframe = document.createElement('div')
        iframe.innerHTML = '<iframe src=\"' + url + '\"></iframe>';
        parentDiv.appendChild(iframe);
    }
}

函数加载多个元素（amountToLoad，url）{
var parentDiv=document.getElementById（“实例”）；
对于（变量i=0；i

然后我用jquery的无限滚动将它加载到html文件中

<script>
    loadMultipleElements(5, "https://www.example.com");
        $(window).scroll(function() {
            if($(window).scrollTop() == ($(document).height()) - $(window).height()) {
                loadMultipleElements(5, "https://www.example.com");
            }
        });
</script>

加载多个元素（5，“https://www.example.com");
$（窗口）。滚动（函数（）{
如果（$（窗口）.scrollTop（）==（$（文档）.height（））-$（窗口）.height（））{
加载多个元素（5，“https://www.example.com");
}
});

因此，当我在本地主机上运行此程序时，它会在打开时渲染所有内容，但会跳到屏幕底部进行渲染，然后跳回到当前视图。这里最大的问题是因为无限滚动，以及它如何一直跳到底部，最终它会无限期地跳下去，因为它一直跳到底部，触发jquery函数

编辑：包含Plunker，但不确定如何让jquery在此时使用Plunker进行无限滚动，所以现在只需将固定加载值设置为10。甚至它已经滚动到底部，因为它渲染更多

---

您的问题是因为当bing自动聚焦搜索栏时，您的浏览器会向下滚动到iframe，以便您可以键入文本

（见“慢动作说明”）

我知道的唯一解决方法是使用iframe

sandbox

属性-仅限HTML5！-防止bing聚焦搜索栏。然后，当iframe完成加载时，我们将使用低JavaScript

---

但是，这种方法存在一些问题。

• 由于它通过在加载

  iframe

  时禁用javascript来工作，因此所需的javascript功能也被禁用。（即没有“最近的故事”）

• 它让人感觉难以置信的粗糙

• 我们想做什么并不明显

---

PS:这里是内容，这里是

---

PPS:如果有人知道更好的方法，我很乐意听到。

JSFiddle会很好。非常感谢，是的，问题在于iframe如何渲染，它通过跳转到帧本身来渲染。通过角度测试以及与HREF和文本的比较发现了这一点+1对于答案哦，等等，问题是它是否需要渲染，所以我猜即使你的工作，因为不需要渲染。我需要引用一个站点，那么对于一个需要渲染的站点，我们将如何进行此操作，例如示例中的bing。我会尽快与您联系…：disbing只是一个示例，还是您必须将其嵌入iframe中的站点？