检查数据属性是否存在，在另一个标签中查找匹配值

Question

由于 Twitter 缩短 links 的方式及其处理媒体实体的方式，我在使用 Twitter 提要时遇到了问题。现在，如果一条推文有图片，则我的提要中的推文的 li 会同时填充图片和图片照片页面的 link。我想去掉图像 link.

脚本的设置方式（我从 this one 开始工作），我首先插入图像的 url（不同于它的 media_url用于创建图像 src) 到图像标记内的数据源属性中。 url 与我要删除的 link 中的 href 值相同。所以我只需要找到数据源属性（如果推文包含一个），获取它的值，找到匹配的 href 值，并隐藏包含它的锚点。

不幸的是，我没有 fiddle，但这是推文模板数据的示例（我从警报中复制了它）：

<p class="author">TENNIS.com</p>
The #AusOpen in pictures: all the best images from the season's first Slam. PHOTOS:
<a href="https://t.co/pbx4viaipB" target="_blank" title="https://t.co/pbx4viaipB">[view]</a>
<a href="https://t.co/9KaZNWUP8N" target="_blank" title="https://t.co/9KaZNWUP8N">[view]</a>
<img src='http://pbs.twimg.com/media/CaTVJq4W4AAkQbT.png' data-source='https://t.co/9KaZNWUP8N' />
<p class="stamp"><span class="date">February 3, 2016</span> RT <a href="http://twitter.com/Tennis" target="_blank" title="Tennis on Twitter">@Tennis</a> on 2/3</p>

（第一个 link 是推文的一部分；第二个是已经嵌入的图片。）

感谢您的帮助。

Answer 1

一个简单的循环就可以了。

对于每张图片，我们抓取 data-source。

然后我们搜索所有将其作为 href 的链接 $('a[href="data-source"]');

$(document).ready(function() {
  $('img').each(function(i) {
    $('a[href="' + $(this).attr('data-source') + '"]').hide();
  });
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p class="author">TENNIS.com</p>
The #AusOpen in pictures: all the best images from the season's first Slam. PHOTOS:
<a href="https://t.co/pbx4viaipB" target="_blank" title="https://t.co/pbx4viaipB">[view]</a>
<a href="https://t.co/9KaZNWUP8N" target="_blank" title="https://t.co/9KaZNWUP8N">[view]</a>
<img src='http://pbs.twimg.com/media/CaTVJq4W4AAkQbT.png' data-source='https://t.co/9KaZNWUP8N' />
<p class="stamp"><span class="date">February 3, 2016</span> RT <a href="http://twitter.com/Tennis" target="_blank" title="Tennis on Twitter">@Tennis</a> on 2/3</p>

此外，我们在这里使用循环，因为我认为您的提要中会有不同的推文。否则，您可以 select 那张图片而不是 each()。

检查数据属性是否存在，在另一个标签中查找匹配值

Check if Data Attribute Exists, Find Matching Value in Another Tag

jquery

twitter-feed