《同理说》RECALL系列 XPATH导引

背景

时常感慨，人脑的容量实在太小了，只能对于部分知识充分灵活的掌握，对于不常用的知识就会渐渐忘却。对于我来说，例如VUE、CSS、XPATH这些知识就算当时学会了，也会因为不经常用而忘记，这就会导致经常重新学习。
这样，一个recall系列的文章就很重要，本篇就是第一篇。

在我眼中的XPATH什么？

对HTML中元素进行的定位的语法。
因为计算机肯定听不懂人话，所以只能听机器能听懂的话，而机器是人设计的，机器能听懂的话也是人设计的，但是设计的人不同，所以有各种各样的话，PATH就是一种机器话。

XPATH中的主要概念

1. 元素 例如 a
2. 属性 例如 href=“aa.a”
3. 文本节点 例如 下面中的文本节点四个字
   <a href="aa.aa">文本节点</a>

根和路径和层级关系

目的是查找元素，说白了就是查找上面哪些主要的cencepts
根就是根，查找是开始的位置
层级关系就是通过什么路径找元素，XPATH里这个PATH就是这个意思
根HTML的层级关系类比，就一定是如下这样：
父/子/孙

具体语法

/元素/元素

这里的元素可以理解为“谓词->筛选”
举例

/b/x/v[condition]
/b/x/v[price>30]

通配符

* 任元素 节点
@* 任属性 节点 （我没用过，需要用的时候再确认）

具体符号

/ 根
// 不考虑位置的所有符合
. 当前
.. 父
@ 属性

大例子

一般能量的人看到上面一大堆东西就已经奔溃了，但是学习就这样，要么从简单的例子起来，感觉未知领域不明觉厉。或者从基础概念开始，然后烧脑放弃。搞定一个事情，是要多角度，多次反复才能掌握，这是一个对于大脑的变形的过程，先从记忆上存储，最后到感知上理解，没有捷径可走！

路径表达式：
• /bookstore/book/title：选择所有book元素的title子元素。
• //title[@lang=‘en’]：选择所有lang属性为en的title元素。
• /bookstore/book[price>20]/title：选择price大于20的book元素的title。

有啥用

最后一个问题就是元素找到了，有啥用？
答案就是编程用。
任何使用XPATH的库，都要程序员指定页面中一个元素的路径。
然后这个库就咔嚓一下根据程序元给的路径把这个元素获取到当前运行程序的一个变量里，这个变量是有数据结构的，后续就可以使用这个变量了，具体怎么使用那就看程序怎么设计的了。

这里提一个有趣的词programmable，
XPATH这个体系就使得HTML更适合programmable