浏览器插件w / jQuery - 捕获DOM更新（专门用于Facebook）

Question

我目前正在编写一个浏览器插件，可以在页面上插入一些HTML元素。我想知道如何在网站更新DOM后检测我的插件，然后根据需要修改HTML。

在这个具体的例子中，我试图在Facebook上插入一些HTML。由于Facebook正在使用AJAX更新其页面，因此使用$（document）.ready（）函数无效。当用户导航到组页面以及用户向下滚动页面并加载更多信息时，这似乎是正确的。

我不能简单地使用.live（）附加一个单击或滚动侦听器，因为在我可以更改DOM之前，我仍然需要等待页面完成更新。

有人有什么想法吗？

Answer 1

您可以使用以下代码加载评论：

var abc = $("#fb-comments-wrapper");
var b = "<fb:comments href=\"page_url"\ num_posts=\"2\" width=\"420\"></fb:comments>"
abc.html(b);

在此之后调用以下代码，它将把facebook注释加载到名为'fb-comments-wrapper'的div中，并在加载时调用'facebookCommentLoaded'函数：

FB.XFBML.parse(document.getElementById('container_of_fb-comments-wrapper'),facebookCommentLoaded);

你的'facebookCommentloadedfunction'可以做你想要的事情：

function facebookCommentLoaded() {
    $(".uiBoxYellow").css("display","none");
    $(".commentas").css("display","none");
}

然而，我无法对facebook div进行任何样式更改。不知何故，他们无法通过document.getElementByClass获得。似乎facebook以防止自定义CSS的方式修改dom。