如何用Scrapy CSS选择器提取首个vcol标签内的指定数据

需求：从以下HTML结构中，仅提取第一个vcol标签内的ITEM1、ITEM2、ITEM3、ITEM4，而非所有ITEM1-ITEM12。

目标HTML结构 #

<div class="main">

    <div class="vcol">
        <div class="cls">
            <ul class="ul_style">
                <li class="li_style"> <h3 class="item"> ITEM1 </h3></li>
                <li class="li_style"> <h3 class="item"> ITEM2 </h3></li>
                <li class="li_style"> <h3 class="item"> ITEM3 </h3></li>
                <li class="li_style"> <h3 class="item"> ITEM4 </h3></li>
            </ul>
        </div>
    </div>

    <div class="vcol">
        <div class="cls">
            <ul class="ul_style">
                <li class="li_style"> <h3 class="item"> ITEM5 </h3></li>
                <li class="li_style"> <h3 class="item"> ITEM6 </h3></li>
                <li class="li_style"> <h3 class="item"> ITEM7 </h3></li>
                <li class="li_style"> <h3 class="item"> ITEM8 </h3></li>
            </ul>
        </div>
    </div>

    <div class="vcol">
        <div class="cls">
            <ul class="ul_style">
                <li class="li_style"> <h3 class="item"> ITEM9 </h3></li>
                <li class="li_style"> <h3 class="item"> ITEM10 </h3></li>
                <li class="li_style"> <h3 class="item"> ITEM11 </h3></li>
                <li class="li_style"> <h3 class="item"> ITEM12 </h3></li>
            </ul>
        </div>
    </div>
    
</div>

当前问题代码 #

以下Scrapy代码会提取所有ITEM1至ITEM12，且存在标签选择错误（HTML中是h3，代码中用了h2）：

for item in response.css('.vcol .cls .ul_style li'):
    item.css('h2 ::text').extract_first()

解决方法 #

方法1：CSS选择器限定第一个vcol #

利用CSS的:first-child伪类定位第一个.vcol，再在其内部遍历目标元素，同时修正标签选择错误：

# 先定位第一个vcol容器
first_vcol = response.css('.vcol:first-child')
# 在第一个vcol内提取所有h3文本
for item in first_vcol.css('.cls .ul_style li h3.item ::text'):
    # 去除文本前后空格
    content = item.get().strip()
    print(content)

方法2：XPath索引定位第一个vcol #

XPath的索引从1开始，直接通过(//div[@class="vcol"])[1]定位第一个目标容器：

# 直接用XPath提取第一个vcol内的所有目标文本
items = response.xpath('(//div[@class="vcol"])[1]//h3[@class="item"]/text()').getall()
# 处理每个文本，去除空格
clean_items = [text.strip() for text in items]
print(clean_items)

关键注意点 #

• 必须先限定目标容器（第一个.vcol），否则选择器会匹配所有同类标签；
• 原代码中错误使用h2选择器，需修正为HTML实际存在的h3标签。

内容的提问来源于stack exchange，提问作者Mah3sh