Question

我有一个具有挑战性的问题！

让我们看看三种可能的情景

情景1

<div class="entry-content">
   <p><a href="#"><img src="#"></a></p>
</div>

情景2

<div class="entry-content">
   <p>&nbsp;</p>
   <p><a href="#"><img src="#"></a></p>
</div>

情景3

<div class="entry-content">
   <p>&nbsp;</p>
   <p>text</p>
   <p><a href="#"><img src="#"></a></p>
</div>

<p>或其他项目的数量将是未定义的。我怎么能只选择第一个img进行“display：none;”？

我的猜测是我必须把.entry-content视为父母，但是如果我做一个img：first-child，它会将<p>作为父级，并且如果有的话将不显示所有图片更多。这就是为什么应该像祖父一样：D如果我们必须使用其他语言而不是CSS，我当然是开放的。

Answer 1

使用纯CSS无法做到这一点，但它在jQuery中非常简单，你很可能已经在页面上加载了它：

jQuery(document).ready(function($){
    $('.entry-content img').first().hide();
});

演示： http://jsfiddle.net/pq7rwfv3/

Answer 2

在主题的functions.php

中添加此功能

function Remove_image_tags($content) {
// for example above function getting data by paramets 
$content = "this is something with an <img src=\"test.png\"/> in it.";
 $content = preg_replace("/<img[^>]+\>/i", " ", $content); 
  return $content;
 }

它会返回

this is something with an in it.

选择“孙子”

2 个答案: