如果另一个元素不存在或不可见,如何隐藏元素?

时间:2016-08-05 13:40:40

标签: javascript html css facebook-social-plugins

我有一些社交按钮可以在我的网站上分享(addthis),我在按钮上方添加了一些文字,箭头指向他们只是说"分享这个!"

有些人使用adblock并拥有隐藏社交按钮的设置。这些人不会看到按钮,但仍会看到文字"分享这个!"。

如何制作"分享这个!"对于那些无法看到社交按钮的人来说,文字会消失吗?有没有办法检查用户是否存在按钮,然后根据它显示/隐藏其他元素? (除了检查显示:无,除非这是adblock用来隐藏元素的东西???我不知道。)

我做了一个简单的小提琴,所以你可以看到我的意思。我刚刚从社交插件中提取了一些代码来显示Facebook图标。

https://jsfiddle.net/bsuup9vf/6/

application.properties

很抱歉,如果之前有人问过类似的问题。

谢谢大家的答案!

3 个答案:

答案 0 :(得分:1)

如果广告拦截器实际上是从您的代码中删除这些项目, 你可以查看JQuery是否存在,如果它们不存在,你可以隐藏它 你想要的元素:)

编辑: 由于我们已经知道adblocker会使元素从页面中完全消失,因此您可以尝试使用以下代码:

var elements = $('#atrsb');
if (elements.length === 0) {
    $('#share-this').hide();
}

答案 1 :(得分:1)

您可以使用jQuery查找元素,并检查DOM元素是否存在并且没有将display值设置为“none”。

var obj = $('.at-icon-wrapper); // Edit to the class or ID that will be hidden/not removed by adblocker
if(obj.length <= 0 || obj.css('display') != "none") // It's not there!
     $('#share-this').css('display', 'none')

答案 2 :(得分:0)

您可以检查页面上是否存在共享元素,如果找不到共享文本,则隐藏共享文本。如果adblock实际删除了元素,这将有效。

var shareEle = document.getElementsByClassName('at-resp-share-element');

if(shareEle.length === 0){
  var shareText = document.getElementsByClassName('share-text');
  for(var i = 0; i < shareText.length; i++){
    shareText[i].style.display = 'none';
  }
}