html – 隐藏具有特定类的第一个div

概述参见英文答案 > CSS selector for first element with class                                    18个 我想隐藏(display：none)带有.leftAddress类的第一个div 这是css fieldset .leftAddress:first-of-type{ display:none;} 这是html 参见英文答案 > CSS selector for first element with class                                    18个
我想隐藏(display：none)带有.leftAddress类的第一个div @H_403_8@

@H_403_8@这是CSS

@H_403_8@

fIEldset .leftAddress:first-of-type{    display:none;}

@H_403_8@这是HTML

@H_403_8@

<fIEldset>    <div ><span ><strong>NOTE:</strong></span> A maximum of 5 address book entrIEs allowed.</div>    <div >Any</div>    <div >         <!--Insert-->        <h3 >Harry Testing</h3>    </div>    <div >         <!--Insert-->        <h3 >Heba ElZany</h3>    </div>    <div >         <!--Insert-->        <h3 >Yamen Shahin&nbsp;(primary address)</h3>    </div>    <div >         <!--Insert-->        <h3 >Yamen2 Shahin2</h3>    </div>    <div >         <!--Insert-->        <h3 >Yamen3 Shahin3</h3>    </div></fIEldset>

@H_403_8@正如你所看到的那样：首先是类型,但它似乎无法正常工作.我在这里错过了什么？
我也尝试过：nth-​​of-type(1)http://jsfiddle.net/arns7/4/它不起作用.
所以这个解决方案对我来说不起作用CSS selector for first element with class

解决方法 CSS解决方案： @H_403_8@

@H_403_8@有了CSS,据我所知,没有直接的方法可以做到这一点.但是,您可以执行以下 *** 作解决方案.

@H_403_8@

fIEldset .leftAddress {    display:none;}fIEldset .leftAddress ~ .leftAddress {    display: block;}

@H_403_8@说明：第一个规则将显示设置为none,对于字段集下具有.leftAddress类的所有元素,然后第二个规则将显示设置为阻止所有具有.leftAddress类的元素,该类也具有相同类的前一个兄弟.因此,总的来说,类为.leftAddress的第一个元素仍然是隐藏的.

@H_403_8@CSS Solution Demo

@H_403_8@注意：正如xec在注释中指出的那样,CSS解决方案仅在用于兄弟元素的元素时才有效.如果它们不是,并且在字段集内的包装器(另一个级别)内有一个带有class =’leftAddress’的元素,则fIEldset中的第一个.leftAddress和fIEldset中包装器中的第一个.leftAddress将被隐藏(像here).

@H_403_8@因此,实质上它隐藏了同一父级中该类的第一个元素.

@H_403_8@基于JavaScript的解决方案：

@H_403_8@如果您在使用JavaScript实现此效果时没有任何问题,可以使用以下代码执行此 *** 作.该解决方案没有基于CSS的解决方案中提到的限制(可以看到样本here).

@H_403_8@

window.onload = function(){    document.getElementsByClassname('leftAddress')[0].style.display = 'none';}

@H_403_8@> document.getElementsByClassname(‘leftAddress’)[0] – 获取DOM中的第一个元素,类名为leftAddress. [0]是必需的,因为getElementsByClassname返回节点列表(如复数名称所示),因此我们必须像对待任何数组一样引用它.
> style.display =’none’ – 相当于CSS显示的JavaScript：none.

@H_403_8@JS Solution Demo

@H_403_8@注意：如第1点所述,这当前隐藏了整个文档中该类的第一个元素.如果要将其限制为字段集中具有该类的第一个元素,也可以这样做.

总结

以上是内存溢出为你收集整理的html – 隐藏具有特定类的第一个div全部内容，希望文章能够帮你解决html – 隐藏具有特定类的第一个div所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。