GlidedSky——CSS反爬（偏移+伪类）

CSS可以排版出精美的页面；CSS也可以通过各种操作，使得用户最终看到的内容和HTML源码的内容千差万别。
让我们通过一些基本的CSS防爬手段（伪类+位置偏移），来巩固下大家的前端基础知识。

伪类是什么？伪类对元素进行分类是基于特征(characteristics)而不是它们的名字、属性或者内容；原则上特征是不可以从文档树上推断得到的

需要获取伪类的父标签在通过标签匹配到它的content的值

div = response.xpath('.//div[@class="col-md-1"]/div')
class_name = div.xpath("./@class")[0]
num = re.findall(r"\.{}\:before\s*.*?\s*content\:\"(\d*)\"".format(class_name), response_str, re.S)[0]
print(num)

偏移是什么？包括元素在屏幕上占用的所有可见空间,元素的可见大小有其高度，宽度决定，包括所有内边距，滚动条和边框大小简单的说就是位置改变进行反爬

查看每个偏移量就可以看出他的偏移的规律从而写代码整理

div_list = response.xpath('.//div[@class="col-md-1"]/div')
div_list = div_list[1:]  #大于4个的class属于偏移量第一个是没用的。
number = [-1, -1, -1]  
for i in range(0, len(div_list)):
    div = div_list[i]
    class_name = div.xpath("./@class")[0]
    data = div.xpath("./text()")[0]
    left = re.findall(r"\.{}\s.*?\sleft\:(.*?)em".format(class_name), response_str)
    print(f"网页:{data}当前位置偏移量：{left}，属于第{i}个值")
    if not left:
        # 如果left为空，表名位置不需要调整
        number[i] = data
    # 否则就需要调整位置
    else:
        index = i + int(left[0])
        number[index] = data
num = "".join(number)

这里的CSS反爬是通过伪类和偏移量结合的所以需要判断是属于偏移量的class还是伪类的。我只是一只菜鸡，如果需要完整代码可以私信，感谢关注！