Question

客户使用外部CRM平台管理我使用此CRM公司提供的专用插件连接到其网站的客户。

使用此插件，我可以在网站上显示我的客户填写此外部平台的信息。

我无法更改此插件的html代码（因为与CRM平台每10分钟同步一次）但我需要通过插件隐藏来自CRM的部分信息。

具体来说，这个插件在页面中生成这种代码

<div class="entry-content" itemprop="text">
    <h4 class='cx_h4'>Headline one</h4> 
    <p>Copy Text 1<br></p> 

    <h4 class='cx_h4'>Headline Two</h4> 
    <p>Copy Text 2<br></p> 

    <h4 class='cx_h4'>Headline Three</h4> 
    <p>Copy Text 3<br></p> 

    <h4 class='cx_h4'>Headline Four</h4> 
    <p>Copy Text 4<br></p> 

    <h4 class='cx_h4'>Headline Five</h4> 
    <p>Copy Text 5<br></p> 

    <h4 class='cx_h4'>Headline Six</h4> 
    <p>Copy Text 6<br></p> 
</div>

您是否可以看到每个标题都有类cx_h4，而复制文本则是一个简单的段落。

类cx_h4 的标题内容永远不会改变。

但p段总是会改变。

我的问题是：

如何隐藏仅这些信息？

<h4 class='cx_h4'>Headline Two</h4> 
    <p>Copy Text 2<br></p> 

<h4 class='cx_h4'>Headline Five</h4> 
    <p>Copy Text 5<br></p> 

<h4 class='cx_h4'>Headline Six</h4> 
    <p>Copy Text 6<br></p>

如果我不能为他们定义类或ID？

我可以使用CSS或jQuery实现这一目标吗？ 这适用于跨浏览器吗？

你有什么提示吗？：）

Answer 1

使用nth-of-type：

＆＃13;

.entry-content h4:nth-of-type(2), /*Select second h4 element */
.entry-content p:nth-of-type(2), /*Select second p element */
.entry-content h4:nth-of-type(5),
.entry-content p:nth-of-type(5),
.entry-content h4:nth-of-type(6),
.entry-content p:nth-of-type(6){
 display:none
}

＆＃13;

<div class="entry-content" itemprop="text">
    <h4 class='cx_h4'>Headline one</h4> 
    <p>Copy Text 1<br></p> 

    <h4 class='cx_h4'>Headline Two</h4> 
    <p>Copy Text 2<br></p> 

    <h4 class='cx_h4'>Headline Three</h4> 
    <p>Copy Text 3<br></p> 

    <h4 class='cx_h4'>Headline Four</h4> 
    <p>Copy Text 4<br></p> 

    <h4 class='cx_h4'>Headline Five</h4> 
    <p>Copy Text 5<br></p> 

    <h4 class='cx_h4'>Headline Six</h4> 
    <p>Copy Text 6<br></p> 
</div>

＆＃13;

Answer 2

使用CSS

.cx_h4, .cx_h4~p{
  display: none;
}

使用jQuery

$('.cx_h4, .cx_h4~p').hide();

隐藏页面中具有相同类或没有类的特定元素

2 个答案: