Question

我正在构建自动更改元素的浏览器插件（safari扩展）（通过“prepend”）。它可以通过调用prepend来完成：

$(document).ready(function(){
  $("a").prepend("<img ...>").
})

但是，如何更改使用javascript动态创建的元素？

Answer 1

您可以先创建对象：

$(document).ready(function(){
    var img = $("<img ...>");
    $("a").prepend(img);
    // do something with img
});

Answer 2

你可以听DOM更改：

$("body").on("DOMSubtreeModified", function(){
    alert('DOM changed');
});

而不是弄清楚发生了什么变化。但是你的问题并不清楚你想做什么。

Answer 3

您可以将您创建的对象存储在全局变量中，以便在整个网页中都可用...就像这样：

var img;
$(document).ready(function(){
    img = $("<img ...>");
    $("a").prepend(img).
});

然后在其他一些功能或某事......

$(img).click(function() { 
     // blah
});

Answer 4

您可以创建触发器，

    $(document).ready(function(){
      $("a").prepend("<img id="imgId"...>").
        $(document).trigger('asd');
    })
$(document).on('asd', function() {

  });

或者您可以创建事件监听器

$(document).ready(function(){
          $("a").prepend("<img id="imgId"...>").

})
$(document).on('click','imgId',function(){

 });

更改动态创建的元素

4 个答案: