XPATH 的第一个元素答案

【问题标题】：First Element of XPATHXPATH 的第一个元素
【发布时间】：2015-03-11 05:50:12
【问题描述】：

问题看起来与XPath Get first element of subset 相同，但我认为它有点不同。

我想获取每个帖子的第一张照片。为此，我想到了以下 xpath 查询：

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

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

但那是说

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

有什么想法吗？

非常感谢

【问题讨论】：

这个//div[contains(@class,'type-post status-publish')]//img[1]/@src 不起作用？
不，不幸的是，它似乎占用了每个帖子的所有 img 元素。我想要做的是只获得 img 标签的第一次出现

标签： php dom xpath

【解决方案1】：

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

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

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

使用这个 XPath 我得到 9 img/@src。

【讨论】：

【解决方案2】：

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

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

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

应该得到每个帖子

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

应该得到包含图像的第一段。然后选择图像。

【讨论】：

很高兴我能帮上忙。我相信@potame 的回答也能胜任。

【解决方案3】：

实际上，您选择的重复问题并不遥远。它在one of it's answers 中有一个解释，听起来很合法：

[] 运算符的优先级高于 // 缩写。

所以//img 缩写会妨碍您。让我们展开它：

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

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

Abbreviated Syntax section in 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"

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

【讨论】：