xpath&css选择器
来源:互联网 发布:linux 复制文件夹命令 编辑:程序博客网 时间:2024/06/11 23:51
本文参考较多,原创基本没有,权当知识归纳。
xpath并不复杂,简单的使用看完之后,及时查阅文档也是可以写出来的。
这里放上我的练手文件,大家可以参考,或者挑毛病(*^__^*) 嘻嘻……
xpath练手项目
XPATH(参考 w3school 和 静觅 和 阮一峰的网络日志)
在 XPath 中,有七种类型的节点:元素、属性、文本、命名空间、处理指令、注释以及文档节点(或称为根节点)。
节点实际上就是各种html标签,属性,以及被标签包围的文字。
搜索方法
xpath使用路径表达式在xml文档中选取节点。节点通过路径或者step来选取。在形式上,"路径表达式"与传统的文件系统非常类似。
- 斜杠(/)作为路径内部的分割符。
- 同一个节点有绝对路径和相对路径两种写法。
- 绝对路径(absolute path)必须用"/"起首,后面紧跟根节,比如/step/step/...。
- 相对路径(relative path)则是除了绝对路径以外的其他*法,比如 step/step,也就是不使用"/"起首。
- "."表示当前节点。
- ".."表示当前节点的父节点
下面是详细介绍:
谓语(Predicates)谓语用来查找某个特定的节点或者包含某个指定的值的节点。谓语被嵌在方括号中。
XPath 通配符可用来选取未知的 XML 元素。
在下面的表格中,我们列出了一些路径表达式,以及这些表达式的结果:
通过在路径表达式中使用“|”运算符,可以选取若干个路径。且供选择的路径之间并无关联。互不干扰,必须各自是完整的独立的路径。
xpath轴可定义相对于当前节点的节点集。
步(step)包括:
轴(axis)
定义所选节点与当前节点之间的树关系
节点测试(node-test)
识别某个轴内部的节点
零个或者更多谓语(predicate)
更深入地提炼所选的节点集
步的语法:
轴名称::节点测试[谓语]
实例
下面列出了可用在 XPath 表达式中的运算符:
这里主要使用是配合lxml
库,下面是一些例子。
#========# 文本读取#========from lxml import etreetext = '''<div> <ul> <li class="item-0"><a href="link1.html">first item</a></li> <li class="item-1"><a href="link2.html">second item</a></li> <li class="item-inactive"><a href="link3.html">third item</a></li> <li class="item-1"><a href="link4.html">fourth item</a></li> <li class="item-0"><a href="link5.html">fifth item</a> </ul> </div>'''html = etree.HTML(text)result = etree.tostring(html)print(result)#========# 文件读取#========from lxml import etreehtml = etree.parse('hello.html')result = etree.tostring(html, pretty_print=True)print(result)#=============# 利用xpath解析#=============from lxml import etreehtml = etree.parse('hello.html')result_list = html.xpath('//li')print result_list
CSS选择器(转自阮一峰的网络日志)
基本选择器
最基本的就是针对标签,类以及id了。
* { margin:0; padding:0; }p { font-size:2em; }.info { background:#ff0; }p.info { background:#ff0; }p.info.error { color:#900; font-weight:bold; }#info { background:#ff0; }p#info { background:#ff0; }
多元素的组合选择器(这个蛮实用的)
div p { color:#f00; }#nav li { display:inline; }#nav a { font-weight:bold; }div > strong { color:#f00; }p + p { color:#f00; }
CSS 2.1 属性选择器
p[title] { color:#f00; }div[class=error] { color:#f00; }td[headers~=col1] { color:#f00; }p[lang|=en] { color:#f00; }blockquote[class=quote][cite] { color:#f00; }
CSS 2.1中的伪类
p:first-child { font-style:italic; }input[type=text]:focus { color:#000; background:#ffe; }input[type=text]:focus:hover { background:#fff; }q:lang(sv) { quotes: "\201D" "\201D" "\2019" "\2019"; }
CSS 2.1中的伪元素
p:first-line { font-weight:bold; color;#600; }.preamble:first-letter { font-size:1.5em; font-weight:bold; }.cbb:before { content:""; display:block; height:17px; width:18px; background:url(top.png) no-repeat 0 0; margin:0 0 0 -18px; }a:link:after { content: " (" attr(href) ") "; }
CSS 3的同级元素通用选择器
p ~ ul { background:#ff0; }
CSS 3 属性选择器
div[id^="nav"] { background:#ff0; }
CSS 3中与用户界面有关的伪类
input[type="text"]:disabled { background:#ddd; }
CSS 3中的结构性伪类(蛮实用的)
p:nth-child(3) { color:#f00; }p:nth-child(odd) { color:#f00; }p:nth-child(even) { color:#f00; }p:nth-child(3n+0) { color:#f00; }p:nth-child(3n) { color:#f00; }tr:nth-child(2n+11) { background:#ff0; }tr:nth-last-child(2) { background:#ff0; }p:last-child { background:#ff0; }p:only-child { background:#ff0; }p:empty { background:#ff0; }
CSS 3的反选伪类
:not(p) { border:1px solid #ccc; }
CSS 3中的 :target 伪类
阅读全文
0 0
- xpath&css选择器
- xpath&css选择器
- jquery css和xpath选择器
- css选择器(selector) xPath的选择器
- Xpath和CSS选择器的使用详解
- xpath选择器
- xpath选择器
- 【选择器小结】正则表达式、XPath选择器、CSS选择器小结和使用场景
- jquery xpath 选择器
- jquery的XPath选择器
- jquery xpath 选择器
- Selenium中CSS选择器与Xpath根据页面结构定位元素比较
- CSS选择器,jQuery选择器
- jQuery选择器 CSS选择器
- css选择器-基本选择器
- css选择器-属性选择器
- CSS选择器选择器
- CSS选择器-属性选择器
- 经典算法_求数组中出现1次的数
- 单调栈--poj3250 Bad Hair Day
- 区分:阻止事件冒泡(stopPropagation)与阻止默认行为(preventDefault)
- 对JAVA RMI的认识(转)
- 《HTML5权威指南》之创建布局
- xpath&css选择器
- spark学习-25-Spark广播变量与共享变量(1)
- Android Kotlin学习(一)
- Android中常用的三种图片压缩方法
- 【ArcGIS Desktop】影像切片步骤——生成切片包
- jsp 动态显示列
- 如何传数组给后台
- 支持负数的高精度模板
- @Test无发导入Junit