Question

让我们假设我希望html文件中存在特定的div元素。它为该div设置了ID＆＃34; one＆＃34;。

我希望javascript在实例化该元素时通知我（例如console.log），并且可能在渲染之前更改该div的css（例如，宽度=＆＃34; 100px＆＃34;）。如果碰巧该特定div不存在，则不执行任何操作或通知在页面完全加载时未呈现div元素。

我听说Observable是在我预期会发生某些事情时获取警报的方法，但有人可以指导我从哪里开始构建该代码吗？

编辑。这是为什么？我想在想要弹出时抓住广告，所以我可以修改广告的div。

Answer 1

如果我找对你，你想要注意<div id="one" />元素。如果需要捕获不同的元素，请更新相应的条件和查询选择器。

var observer = new MutationObserver(function (mutations) {
  mutations.forEach(function (mutation) {
    mutation.addedNodes.forEach(function (addedNode) {
      if (!addedNode.getAttribute) {
        return; // not an element node
      }
      if (addedNode.getAttribute('id') === 'one') { // replace with
                                                    // appropriate condition
        // found, do whatever
      }
      var nodes = addedNode.querySelectorAll('div[id=one]'); // replace with
                                                             // appropriate selector
      [].forEach.call(nodes, function (node) {
        // found, do whatever
      });
    });
  });
});

observer.observe(document.body, { // you might replace it with an appropriate
                                  //  more specific parent element
  childList: true,
  subtree: true
});

通知何时html元素被实例化

1 个答案: