Python3 CssSelector定位方式实例详解

例子：

html = """
    <div id='content'>
        <ul class='list'>
            <li class='one'>哈哈</li>
            <li class='two'>Two</li>
            <li class='three'>Three</li>
            <li class='four four1 four2 four3'>Four</li>
            <div id='inner'>呵呵呵
                <a href='http://www.baidu.com'>百度一下</a>
                <p>第一段</p>
                <p>第2段</p>
                <p>第3段</p>
                <p>第4段
                    <span id="first">大师傅大师傅！！</span>
                </p>
                <p>第5段</p>
                <p>第6段</p>
            </div>
            <div id='inne inner'>嘿嘿嘿</div>
        </ul>
        <ul class='text'>This is Text</ul>
    </div>
"""

基本css选择器

CSS选择器中，最常用的选择器如下：

选择器	描述	举例
*	通配选择器，选择所有的元素	*
<type>	选择特定类型的元素，支持基本HTML标签	h1
.<class>	选择具有特定class的元素。	.class1
<type>.<class>	特定类型和特定class的交集。（直接将多个选择器连着一起表示交集）	h1.class1
#<id>	选择具有特定id属性值的元素	#id1

if __name__=='__main__':
    html = etree.HTML(html)
    Csses = html.cssselect('*')
    for css in Csses:
        print (css.text)

该程序会输出所有标签的文本内容，即*表示选择所有的元素

    Csses = html.cssselect('li')
    for css in Csses:
        print (css.text)

输出结果：

哈哈
Two
Three
Four

该程序会输出“li”标签的文本内容，即<type>选择特定类型的元素，换成其他标签则显示相应的文本

    Csses = html.cssselect('.text')
    for css in Csses:
        print (css.text)

输出结果：

This is Text

扫描二维码关注公众号，回复： 3475093 查看本文章

代码片中的.text表示选择class属性值为text的标签。

Csses = html.cssselect('li.four1')
    for css in Csses:
        print (css.text)

输出结果：

Four

代码片中的li.four1表示选择所有的li标签，class属性值包含four1的标签。

    Csses = html.cssselect('#inner')
    for css in Csses:
        print (css.text)

输出结果：

呵呵呵

代码片中的#inner表示id属性值为inner的标签。

属性选择器

除了最基本的核心选择器外，还有可以基于属性的属性选择器：

​选择器	描述	举例
[attr]	选取定义attr属性的元素，即使该属性没有值	[placeholder]
[attr="val"]	选取attr属性等于val的元素	[placeholder="请输入关键词"]
[attr^="val"]	选取attr属性开头为val的元素	[placeholder^="请输入"]
[attr$="val"]	选取attr属性结尾为val的元素	[placeholder$="关键词"]
[attr*="val"]	选取attr属性包含val的元素	[placeholder*="入关"]
[attr~="val"]	选取attr属性包含多个空格分隔的属性，其中一个等于val的元素	[placeholder~="关键词"]

    Csses = html.cssselect('[href]')
    for css in Csses:
        print (css.text)

输出结果：

百度一下

代码片中的[href]表示包含href属性的所有标签

    Csses = html.cssselect('[class=two]')
    for css in Csses:
        print (css.text)

输出结果：

Two

代码片中的[class=two]表示class属性值为two的所有标签

Csses = html.cssselect('[class^=t]')
    for css in Csses:
        print (css.text)

输出结果：

Two
Three
This is Text

代码片中的[class^=t]表示class属性值以t开头的所有标签

    Csses = html.cssselect('[class$=e]')
    for css in Csses:
        print (css.text)

输出结果：

哈哈
Three

代码片中的[class$=e]表示class属性值以e结尾的所有标签

    Csses = html.cssselect('[class*=r]')
    for css in Csses:
        print (css.text)

输出结果：

Three
Four

代码片中的[class*=r]表示class属性值包含r字母的所有标签

Csses = html.cssselect('[id~=inner]')
    for css in Csses:
        print (css.text)

输出结果：

呵呵呵
                
嘿嘿嘿

代码片中的[id~=inner]表示id属性值包含inner的所有标签，inner是一个单独的词，即如果有多个属性值，则必须以空格隔开

关系选择器

有一些选择器是基于层级之间的关系，这类选择器称之为关系选择器。

选择器	描述	举例
<selector> <selector>	第二个选择器为第一个选择器的后代元素，选取第二个选择器匹配结果	.class1 h1
<selector> > <selector>	第二个选择器为第一个选择器的直接子元素，选取第二个选择器匹配结果	.class1 > *
<selector> + <selector>	第二个选择器为第一个选择器的兄弟元素，选取第二个选择器的下一兄弟元素	.class1 + [lang]
<selector> ~ <selector>	第二个选择器为第一个选择器的兄弟元素，选取第二个选择器的全部兄弟元素	.class1 ~ [lang]

   Csses = html.cssselect('div li')
    for css in Csses:
        print (css.text)

输出结果：

哈哈
Two
Three
Four

代码片中的div li表示div标签下的所有li标签，中间用空格隔开

   Csses = html.cssselect('div>a')
    for css in Csses:
        print (css.text)

输出结果：

百度一下

代码片中的div>a表示div标签下的所有a子标签，a必须是div的子标签

    Csses = html.cssselect('li+li')
    for css in Csses:
        print (css.text)

输出结果：

Two
Three
Four

代码片中的li+li表示li标签和li标签是兄弟标签，满足这样条件的一共有三个。

    Csses = html.cssselect('a+p')
    for css in Csses:
        print (css.text)

输出结果：

第一段

    Csses = html.cssselect('a~p')
    for css in Csses:
        print (css.text)

输出结果：

第一段
第2段
第3段
第4段
                    
第5段
第6段

联合选择器与反选择器

利用联合选择器与反选择器，可以实现与和或的关系。

选择器	描述	举例
<selector>,<selector>	属于第一个选择器的元素或者是属于第二个选择器的元素	h1, h2
:not(<selector>)	不属于选择器选中的元素	:not(html)

    Csses = html.cssselect('li,p')
    for css in Csses:
        print (css.text)

输出结果：

哈哈
Two
Three
Four
第一段
第2段
第3段
第4段
                    
第5段
第6段

代码片中的li,p表示选择所有的li标签和p标签

   Csses = html.cssselect(':not([class])')
    for css in Csses:
        print (css.text)

输出结果：

None
None

        
呵呵呵
                
百度一下
第一段
第2段
第3段
第4段
                    
大师傅大师傅！！
第5段
第6段
嘿嘿嘿

代码段中的:not([class]表示选择不包含class属性的所有标签。