nth-child 改为 nth-of-type

最新推荐文章于 2021-03-15 16:47:48 发布
最新推荐文章于 2021-03-15 16:47:48 发布
阅读量117 收藏
点赞数
分类专栏： 爬虫
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/huanghong6956/article/details/112279158
版权

nth-child 改为 nth-of-type

huanghong6956
关注
专栏目录
CSS中的nth-child和nth-of-type选择器
osbron_J的博客
11-13 824
CSS中的nth-XXX选择器 我们知道，在CSS中，选择相同类名，相同标签的子级元素或者兄弟元素都很快捷方便，但是如果要有目的性的去筛选一些子级或者同级元素，那么，就要用到这里所说的选择器 nth-child和nth-last-child 这个选择器可以选择同级的一类标签，或者类。 根据一些数学规则: an+b:代表匹配父容器下面中第an+b个子元素，a，b都可以为0 比如： <head&...
Python 使用 BeautifulSoup bs4 时 nth-child(6) 报错:
weixin_42544006的博客
03-11 1651
报错: 'Only the following pseudo-classes are implemented: nth-of-type.') NotImplementedError: Only the following pseudo-classes are implemented: nth-of-type. 解决办法: nth-child 改为 nth-of-type from ...
python中bs4库css选择器:nth-child方法无法使用
moshanghuali的博客
04-13 2768
解决方法一：更新bs4库至4.7.0以上,然后就可以使用了。（推荐） pip install --upgrade beautifulsoup4 解决方法二：按照提示使用nth-of type 替换 但是需要注意的是，nth-child和nth-of-type 很不同。 div > p:nth-child(1) 表示div元素下的所有直接子元素不论类型，只按照顺序取第一个。 ...
nth-child（）和nth-of-type 用法
dianfengzao1245的博客
09-14 153
nth-child（）和nth-of-type区别 1 .c p:nth-child（2）：在C这个类下，找某个父元素下的第2个子元素，看是否是p 如果是，p元素身上加样式，不是表示失效【如果C 下面有多个子孙，挨个寻找 ，可以命中多个子孙的子元素】 2 .c p:nth-of-type （2）：与上面类似，不同的是 type是寻找第二个p元素，如果不是它还会继续找 知道...
:nth-child()与:nth-of-type()的使用方法及区别
weixin_43762150的博客
07-08 553
1. 简介 本文主要讨论伪类选择器 :nth-child()与:nth-of-type()的使用方法及区别，并引申:first-child的使用方法 2. :nth-child(n)和:nth-of-type()的使用方法及区别 2.1 定义 类别 定义 :nth-child(n) 匹配父级元素中的第n个子元素，子元素类型没有限制 p:nth-child(2) 匹配在父级中位于第二位的p元素。换言之，匹配父级的第二个子元素，且该子元素为p。 :nth-of-type(n) 匹配父
CSS 选择器:nth-child和:nth-of-type之间的差异
单枪匹码
12-30 294
1、:nth-child和:nth-of-type都是css3中的伪类选择器，其作用近似却又不完全相同，其实理解了这两个选择器的使用，其他的伪类选择器使用起来也就自然得心应手、游刃有余了。 2、demo：我们创建一个父级元素，然后为它的子元素修改样式： html：（我们修改第二个p标签颜色为红色） <section> <p>我是第1个p标签</p> ...
CSS3中nth-of-type与nth-child区别分析详解，nth-of-type和nth-child对比区别，CSS3强大选择器nth-of-type，nth-child
MFWSCQ的博客
07-01 4655
CSS3出来那么久了，很多新特性都已经得到了主流浏览器的很好支持，相信很多人都在项目中使用过nth-of-type(n)以及nth-child(n)这两个选择器，这两个选择器功能很像，甚至在很多情况下使用的作用是相同的，但又有差异，容易给人造成困扰，我之前也是困扰了一段时间，查了忘，忘了查，浪费了很多时间。这里做一个测试以及梳理，以便查询参考记忆。 elt:nth-child(n)：所干的事情分...
详解CSS3选择器:nth-child和:nth-of-type之间的差异
09-24
在最初的示例中，当HTML结构为多个连续的`<p>`标签时，`:nth-child(2)`和`:nth-of-type(2)`的效果相同，因为在这个情况下，第二个子元素恰好也是第二个`<p>`元素。 2. `:nth-of-type(n)` 选择器： `:nth-of-type(n)...
nth-child(x)与nth-of-type(x)用法
fairycode的博客
03-15 307
近期在复习前端，现在html css进行到form表单 即将进入js阶段：） 码码后想达到的效果大概如此 input text radio select textarea等 在html内给几个小标题用了同样的class <form action=""> <div class="title">姓名</div> <input type="text" > <div class="title">昵称</div&
CSS3 中关于 *-of-type 和 *-child的差异性及适用场景
大前端
07-18 954
CSS3 中有很多表示元素序号的选择器，有以下几种:first-child、:first-of-type、:last-of-type、:only-of-type、:only-child、:nth-child(n)、:nth-last-child(n)、:nth-of-type(n)、:nth-last-of-type(n)、:last-child 初学者可能会比较容易混淆，这里可以分一下类 ...
css选择器中:nth-child()和:nth-of-type()简洁明了的区别
qq_39498924的博客
07-14 344
以https://bj.fang.lianjia.com/loupan/p_ycyxhfaawyk/huxingtu/1120032477145011.html为例，观察.news-glob > div:nth-child(10)和.news-glob > div:nth-of-type(10)的区别。 实验发现： div:nth-child(10)：是选择第10个子节点（按顺序看所有子节点），若第10个子节点是div节点，则返回该节点，若该节点不是div节点，则返回空。 div:nth-of-
:nth-child的坑用:nth-of-type解决
qq_41818857的博客
02-03 318
大的大
关于:nth-child和:nth-of-type伪类选择器
境界线上的地平线
05-22 4196
首先是二者的区别 :nth-child(n) 是选择父元素的第n个子元素。 :nth-of-type(n) 是选择父元素的第n个同类型的子元素 举个例子： &amp;lt;div&amp;gt; &amp;lt;h1&amp;gt;title1&amp;lt;/h1&amp;gt; &amp;lt;p&amp;gt;paragraph1&amp;lt;/p&amp;gt; &amp;l
批量下载音乐
huanghong6956的博客
01-29 1584
import requests, os songlistd = [] header = { 'User-Agent': 'Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36'} url = 'url=https://...
mitmproxy安装
huanghong6956的博客
05-08 783
https://www.cnblogs.com/grandlulu/p/9525417.html 本文是一个较为完整的mitmproxy教程，侧重于介绍如何开发拦截脚本，帮助读者能够快速得到一个自定义的代理工具。 本文假设读者有基本的 python 知识，且已经安装好了一个python3 开发环境。如果你对nodejs的熟悉程度大于对 python，可移步到anyproxy...
批量下载图片re,requests,os三大模块用法
huanghong6956的博客
01-29 589
import re,requests,os #头部模拟 header={'User-Agent':'Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36'} #计数 n=1 #写入 def down(iters): glo...
python《文件下载进度显示》 urllib.request.urlretrieve(self.__path,self.__name,jindu)
huanghong6956的博客
01-29 492
#coding=utf-8 import threading import os,sys import urllib.request as ur #显示调用函数 def jindu(a,b,size): os.system('cls') per=100*a*b/size per=round(per, 2) if per&gt;100: per=...
js控制nth-child
最新发布
08-25
nth-child是CSS选择器中的一种用法，用来选择元素的父元素下的第n个子元素。它可以用于控制元素的样式或行为。 在JavaScript中，可以使用jQuery库来控制nth-child选择器。以下是一个示例代码： ```javascript $(document).ready(function() { // 选择每个父元素下的第2个子元素，并添加自定义样式 $('p:nth-child(2)').addClass('custom-class'); }); ``` 在上述示例中，当文档加载完成后，会选择每个父元素下的第2个子元素（即p元素），然后为这些元素添加名为"custom-class"的自定义样式。你可以根据需求修改选择器和添加的样式来实现特定的功能。 注意，上述示例使用的是jQuery库，因此在使用之前需要确保页面中已经加载了jQuery库。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [JS——nth-child和nth-of-type的区别以及nth-of-type下的坑](https://blog.csdn.net/fuzhijieabc/article/details/125991123)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *3* [jquery nth-child()选择器的简单应用](https://download.csdn.net/download/weixin_38546846/14904977)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

huanghong6956

你的鼓励是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值