XPATH的第一个元素


First Element of XPATH

问题看起来像:XPath 获取子集的第一个元素,但我认为它有点不同。

以下是以下博客:http://www.mademoiselledeco.com/

我想得到每个帖子的第一张照片。为此,我想到了以下 xpath 查询:

//div[contains(@class,'type-post status-publish')]//img/@src

按照我提到的上一篇文章的例子,我也尝试了: //div[contains(@class,'type-post status-publish')](//img/@src)[1]

但这说明

警告:DOMXPath::query():无效的表达式

知道吗?

多谢

好的,我明白了,在检查了来源之后:每个<img>都包含在一个<p>中,因此img[1]将匹配所有图片,因为它们在段落的上下文中是第一张图片。

在这种情况下,我宁愿尝试获取包含图像的第一段:

//div[contains(@class,'type-post status-publish')]//p[img][1]/img/@src

有了这个XPath,我得到了9 img/@src.

//div[@class='post-content-container']//p[./img][1]/img

这不是最好的解决方案,但我认为它会起作用。

//div[@class='post-content-container']

应该得到每个帖子

//p[./img][1]/img

应该得到第一段,其中包含一个图像。然后选择图像。

实际上,您选择的重复问题并不遥远。它在其中一个答案中有一个解释,听起来很合法:

[]运算符的优先级(绑定更强)高于//缩写。

因此,//img缩写阻碍了您的方式。让我们扩展它:

/descendant-or-self::node()/child::img

在末尾添加[1]将选择每个第一个 img 子项(这与其他人概述的完全相同)。这也是为什么这里的谓词优先级更高的原因。

Xpath 1.0 中的缩写语法部分实际上通过注释涵盖了这一点:

注意:位置路径//para[1]与位置路径/descendant::para[1]不同。后者选择第一个后代 para 元素;前者选择所有后代para元素,这些元素是其父母的第一个para子元素。

也就是说:您不是在查找descendant-or-self轴及其中的任何节点子节点,而只是查找descendant轴中的第一个img元素:

/descendant::img[1]

所以完整的 xpath 表达式:

//div[contains(@class,'type-post status-publish')]/descendant::img[1]/@src

示例的结果 (10):

 src="http://www.mademoiselledeco.com/wp-content/uploads/2015/03/Couleur-FionaLynch-Caroline-St.jpg"
 src="http://www.mademoiselledeco.com/wp-content/uploads/2015/02/2-OF-MO-cascade-lumineuse2-1024x398.jpg"
 src="https://s-media-cache-ak0.pinimg.com/736x/2e/f7/eb/2ef7eb28dc3e6ac9830cf0f1be7defce.jpg"
 src="http://www.mademoiselledeco.com/wp-content/uploads/2015/01/couleur-peinture-flamant-vert-trekking.jpg"
 src="http://www.mademoiselledeco.com/wp-content/uploads/2015/01/Lily-of-the-Valley-Designed-by-Marie-Deroudilhe-02.jpg"
 src="http://www.mademoiselledeco.com/wp-content/uploads/2015/01/shopping-decoration-jaune-bleu-delamaison-1024x866.jpg"
 src="http://www.mademoiselledeco.com/wp-content/uploads/2015/01/wikao-cheminee-berlin-mademoiselledeco4.jpg"
 src="http://www.mademoiselledeco.com/wp-content/uploads/2015/01/voeux2015-mademoiselledeco-blog.jpg"
 src="http://www.mademoiselledeco.com/wp-content/uploads/2014/12/suite-novotel-constance-guisset-1.jpg"
 src="http://www.mademoiselledeco.com/wp-content/uploads/2014/12/wish-list-decoration-noel-2014.jpg"

我希望这能带来一些启示。