Javascript 在阴影中平滑滚动

我正在开发一个网络应用程序，该应用程序由使用聚合物的网络组件制成。每个组件都有许多子组件，每个子组件都有自己的阴影DOM

我正在专门处理一个具有许多字段的大窗体的部分，其中一些字段位于视口之外。当我尝试提交表单时，会调用一个验证函数。对验证函数进行了调整，使其不仅返回布尔值，还设置了一个数组，其中包含名为“invalidElements”的无效组件

然后，我可以调用第一个无效元素的焦点，这样当我单击submit时，元素就会聚焦并进入视口

    invalidElements[0].focus()

问题是，我希望平滑地滚动到无效字段。我不能使用“滚动行为：平滑”，因为所有ID都隐藏在父组件的许多阴影DOM下

即使我可以从invalidElement[0]获取id

    invalidElement[0].id

。。。之后我无法访问它。我的意思是，我可以，但这意味着要爬进每一个影子世界的网站。由于表单的大小很大，而且有很多字段，因此无法执行此操作

---

我怎样才能平滑地滚动到焦点元素？

如果我理解正确，您喜欢滚动到元素而不访问任何其他控件。然后使用Javascript您可以实现如下所示

invalidElement.scrollIntoView({ block: "center", inline: "center"});

如果您想通过访问所有元素来缓慢滚动到元素（平滑滚动），可以使用下面的代码段

invalidElement.scrollIntoView({ block: "center", inline: "center", behavior: "smooth" });

---

我不明白您为什么将代码包装在元素

invalidElements[0]中。focus（）

请在此处提供实际代码和一些方法来说明您的问题（如果它不起作用），这不是要包装的，很抱歉造成混淆。它起作用了，谢谢；）我认为滚动到视图只需要一个ID，这是一个问题，因为它隐藏在阴影DOM中。但我错了。。。