javascript - 选择每个新的 A 元素

Question

我有一个自动加载图像的页面。这些图片包含在元素 <a> 中.我需要找到并删除所有元素 <a> , 除了那些包含 .private_overlay 类的.我为这段非常简单的代码创建了:

$('#content a').not($('a').find('div.private_overlay').parent()).remove();

它在我手动运行时有效。但它不适用于我运行脚本时加载的元素。

我试过这样循环:

$(window).scroll(function() {
  $('#content a').not($('a').find('div.private_overlay').parent()).remove();
});

它在某种程度上是有效的。但这不是我所期望的。此脚本将通过单击运行。

我只想申请处理此页面上的新元素:

有很多带有帖子的 block 。我正在寻找标记为私有(private)的帖子。为此，我必须隐藏所有未标记的帖子，包括尚未加载的帖子。

这就是它目前的外观和工作方式:

我需要知道如何选择新元素，因为我仍然需要找到下一张或上一张图片。

我粘贴在代码下面:

function searchBox() {
  $('body').append('<div id="searchBox"><p style="margin: 0px;"><strong>Wyszukiwarka prywatnych postów:</strong></p>    \
<p style="margin: 5px auto; text-align: center"><input id="previousPost" type="button" value="Poprzedni post"></input>  \
<input id="nextPost" type="button" value="Następny post"></input></p>   \
<p style="margin: 0px;"><input id="hidePosts" type="checkbox"></input><label for="hidePosts" style="vertical-align: bottom;">Kasuj niepotrzebne posty</label></p></div>');

  $('#searchBox').css({
    position: 'fixed',
    left: '20px',
    bottom: '20px',
    background: 'white',
    color: 'rgb(125, 125, 125)',
    fontSize: '13px',
    border: '1px solid rgb(125, 125, 125)',
    borderRadius: '7px',
    padding: '7px',
    zIndex: '9999',
    boxShadow: '0px 0px 4px rgba(0, 0, 0, 0.3)',
    display: 'none'
  }).fadeIn();

  $('#hidePosts').one('click', function() {
    $(window).scroll(function(){
      $('#content a').not($('a').find('div.private_overlay').parent()).remove();
    });
    $(this).attr('disabled','disabled');
  });

  $('#previousPost').click(function() {
    $('html, body').stop().animate({
      scrollTop: $("#content a").prev().offset().top
    }, 2000);
  });

  $('#nextPost').click(function() {
    $('html, body').stop().animate({
      scrollTop: $("#content a").next().offset().top
    }, 2000);
  });
};

我试着去理解this article但我不明白。

Answer 1

好的，通过评论中的对话，您想要 <a> 的所有实例没有类 private_overlay当用户单击按钮时立即删除。因此，首先，可以简化删除代码。

$('#content a').not('a.private_overlay').remove();

其次......我们需要做的就是在用户单击按钮时调用此操作。

$('button#remove').click(function() {

    $('#content a').not('a.private_overlay').remove();

});

这甚至适用于动态插入的内容，如 Fiddle 所示。

Working Fiddle