如何用XPath从data-article-info属性的JSON结构中提取指定元素

根据你的场景，提取data-article-info属性里的指定JSON字段，不同工具/环境有不同的实现方式：

1. 支持XPath 3.1的工具（如Saxon、BaseX） #

如果你的XPath处理器支持3.1版本，可以直接用内置的JSON解析函数一步到位：

• 提取author_name：

  //div[@class='l-hidden entry_data']/json(@data-article-info)?->'author_name'
  

• 提取likes：

  //div[@class='l-hidden entry_data']/json(@data-article-info)?->'likes'
  

语法说明：

• json(@data-article-info)：将属性值解析为JSON对象
• ?->'key'：安全访问JSON对象的指定键（避免因对象不存在报错）

2. Python环境（结合lxml + json模块） #

如果用Python处理HTML，先通过XPath提取完整的JSON字符串，再用json模块解析后取值：

from lxml import etree
import json

# 示例HTML内容
html_content = """
<html>
<body>
  <div class="l-hidden entry_data"
       data-article-info='{
          "author_name": "Maria R",
          "-g water":":诚意",len(x sequence}真格 Follow
          "tags": [],
          "comments": 15,
          "likes": 27,
          "favorites": 8,
          "is_advertisement": false,
          "subsite_label": "marketing",
          "id": 712141,
          "is_wide": true,
          "is_ugc": true,
          "date": "Wed, 31 May 2023 13:54:50 +0300",
          "is_special": false            }'>
  </div>
</body>
</html>
"""

# 解析HTML并提取JSON字符串
tree = etree.HTML(html_content)
json_str = tree.xpath("//div[@class='l-hidden entry_data']/@data-article-info")[0]

# 解析JSON并提取指定字段
article_data = json.loads(json_str)
print(article_data['author_name'])  # 输出: Maria R
print(article_data['likes'])       # 输出: 27

3. JavaScript/浏览器控制台 #

在浏览器环境或前端代码中，直接通过DOM API提取并解析数据：

// 获取目标div元素
const targetDiv = document.querySelector('div.l-hidden.entry_data');
// 解析data-article-info属性为JSON对象
const articleInfo = JSON.parse(targetDiv.dataset.articleInfo);
// 提取指定字段
console.log(articleInfo.author_name); // 输出: Maria R
console.log(articleInfo.likes);      // 输出: 27

说明：dataset.articleInfo是浏览器对data-article-info属性的驼峰式映射写法。

4. Scrapy爬虫场景 #

如果是用Scrapy做网页爬取，可在解析函数中结合XPath和JSON解析：

import scrapy
import json

class ArticleSpider(scrapy.Spider):
    name = 'article_spider'
    start_urls = ['https://example.com/target-page']

    def parse(self, response):
        # 提取JSON字符串
        json_raw = response.xpath("//div[@class='l-hidden entry_data']/@data-article-info").get()
        if json_raw:
            data = json.loads(json_raw)
            # 生成包含指定字段的结果
            yield {
                'author': data['author_name'],
                'likes_count': data['likes'],
                'favorites': data['favorites']
            }

内容的提问来源于stack exchange，提问作者Alex R