在能够操作它之前，您如何等待 DOM 元素存在

Question

我在我的AngularJS应用程序中使用Angular材质和md-select。当用户单击 md-select 时，会出现一个下拉列表，并将一个带有标签 Name 的覆盖添加到 DOM 中。我正在尝试在用户单击md-select后立即添加类或样式

var el = document.getElementsByTagName("md-backdrop");
el.style.backgroundColor = "rgba(255, 255, 255, 0.7)";

因此，因为我假设他在代码运行时还不存在在 DOM 中，所以我得到了 TypeError：无法在我的控制台中设置 undefined 的属性"backgroundColor"。

有什么方法可以在添加样式之前等待标签存在，或者有更好的方法可以做到这一点吗？

Answer 1

不幸的是，

如果您在渲染时间后将元素推送到 DOM，则无法在纯原版 JS 中观看 UI。

如果上面是静态 HTML，您可以使用渲染 DOM 时触发的事件

document.addEventListener("DOMContentLoaded", function() {
  var el = document.getElementsByTagName("md-backdrop");
  el.style.backgroundColor = "rgba(255, 255, 255, 0.7)";
});