：CSS选择器的问题_html/css
2020-11-27
来源：知网教育
网页中有个类叫做 class1, 这是唯一能识别网页的东西，只出现一次。他的子元素的子元素...（四级）之后有多个并列的元素（有网页内唯一的ID, p0c1,p0c2,...）需要分别做不同的修改。
information
我试了两种方法都有问题：
1、直接使用ID。但这将和网站的其他网页冲突（结构类似，有重复的ID）
2、使用class1 :nth-child(1) :nth-child(3) :nth-child(1) :nth-child(1) 。但是选择器用一个nth-child的时候不仅选了第n个子元素，还选了第n个子元素的子元素，造成冲突。
请问，是否有如下方法：
1、在class1的子孙元素中按ID号选择？
2、如何正确的使用nth-child只选择第n个元素而不牵扯其他后代？
各位如果有其他方法，也敬请告知，多谢！
回复讨论(解决方案)
$('.class1 div div div #p0c1')
第二个问题：
我从你代码copy下来的结构结果用这个也行，可能你给的结构有问题所以和你的（:nth-child(1) :nth-child(3) :nth-child(1) :nth-child(1)）有点出入，不是大问题
$('.class1 div:nth-child(1) div:nth-child(1) div:nth-child(2) #p0c1')
试验了下这个方法
nth-child(1)
结果可以总结为：
这个nth-child(n) 是针对所有 有父元素的子元素起作用，当然 如果前面用了.class1 div:nth-child(1) div:nth-child(1) div:nth-child(2) 想后面再加一次过滤:nth-child(1) 就是在那一串的结果里的所有层次的子元素（其实就包含了所有子孙）只要符合就都会成为返回结果
举个例子：
div:nth-child(2)
如果直接用这个来做选择器，那整个HTML里 满足一下几点的所有元素都会成为结果
1. 这个有父元素
2. 这个子元素排行第二，有一个哥哥
3. 这个元素是 div
是的，第二个nth-child的解释我明白了，确实比较头疼。好在第一个好像能用。我晚上有空该好程序后就能确定是不是好用，先谢谢了。
楼主，你先把结构整理好。 区分不同的东西，可以使用id，id是唯一的。
楼主，你先把结构整理好。 区分不同的东西，可以使用id，id是唯一的。
其他网页也有这个ID，只用ID会冲突的。
$('.class1 div div div #p0c1')
基本上解决了问题，周一到公司还要测试一下，但是应该能用。多谢！