使用 Floki 访问 html 个属性

Question

我正在尝试从 HTML body 中获取图像，我用 Floki 抓取了图像。现在 body 是

[
  {"div", [{"class", "a-cover-image"}, {"data-state", "not-initialised"}],
   [
     {"div",
      [
        {"class", "content"},
        {"data-image",
         "/sites/default/files/legacy/khloe-kardashian-anxiety-pregnancy.png"},
        {"data-text", "A photo of Khloe Kardashian dressed up for a night out"}
      ],
      [
        {"div",
         [
           {"class", "a-cover-image__cover a-cover-image__cover-loading-inner"},
           {"style",
            "background-image: url('/sites/default/files/legacy/khloe-kardashian-anxiety-pregnancy.png')"}
         ], []}
      ]},
     {"div",
      [
        {"class", "a-cover-image__cover a-cover-image__cover-small"},
        {"data-image",
         "/sites/default/files/styles/1x1/public/legacy/khloe-kardashian-anxiety-pregnancy.png?itok=agZilCJ6"},
        {"data-text", "A photo of Khloe Kardashian dressed up for a night out"},
        {"data-height", ""},
        {"data-width", ""}
      ], []},
     {"div",
      [
        {"class", "a-cover-image__cover a-cover-image__cover-medium"},
        {"data-image",
         "/sites/default/files/styles/3x2/public/legacy/khloe-kardashian-anxiety-pregnancy.png?itok=tnPqQNhC"},
        {"data-text", "A photo of Khloe Kardashian dressed up for a night out"},
        {"data-height", ""},
        {"data-width", ""}
      ], []},
     {"div",
      [
        {"class", "a-cover-image__cover a-cover-image__cover-large"},
        {"data-image",
         "/sites/default/files/styles/16x9/public/legacy/khloe-kardashian-anxiety-pregnancy.png?itok=YgdCfuT2"},
        {"data-text", "A photo of Khloe Kardashian dressed up for a night out"},
        {"data-height", ""},
        {"data-width", ""}
      ], []},
     {"div",
      [
        {"class", "a-cover-image__cover a-cover-image__cover-xl"},
        {"data-image",
         "/sites/default/files/styles/16x9/public/legacy/khloe-kardashian-anxiety-pregnancy.png?itok=YgdCfuT2"},
        {"data-text", "A photo of Khloe Kardashian dressed up for a night out"},
        {"data-height", ""},
        {"data-width", ""}
      ], []}
   ]}
]

所以我正在尝试从 a-cover-image__cover-small 中获取 data-image 并且我知道我可以像这样从 body 中获取该元素

body |> Floki.find(".a-cover-image__cover-small") 输出将是

[
  {"div",
   [
     {"class", "a-cover-image__cover a-cover-image__cover-small"},
     {"data-image",
      "/sites/default/files/styles/1x1/public/legacy/khloe-kardashian-anxiety-pregnancy.png?itok=agZilCJ6"},
     {"data-text", "A photo of Khloe Kardashian dressed up for a night out"},
     {"data-height", ""},
     {"data-width", ""}
   ], []}
]

我很难理解如何获得 data-text，我怎样才能 return？谢谢

Answer 1

你可以只使用 Floki.attribute/2:

body |> Floki.find(".a-cover-image__cover-small") |> Floki.attribute("data-text")
# => ["A photo of Khloe Kardashian dressed up for a night out"]

如果你知道只有一个匹配元素，你可以用模式匹配提取它：

[text] = body |> Floki.find(".a-cover-image__cover-small") |> Floki.attribute("data-text")
text # => "A photo of Khloe Kardashian dressed up for a night out"

使用 Floki 访问 html 个属性

Accessing html attributes with Floki

elixir