如何使用Nokogiri在页面上创建HTML标记结构的大纲？_Html_Ruby_Html Parsing_Nokogiri

如何使用Nokogiri在页面上创建HTML标记结构的大纲？

html ruby

如何使用Nokogiri在页面上创建HTML标记结构的大纲？,html,ruby,html-parsing,nokogiri,Html,Ruby,Html Parsing,Nokogiri,我正在尝试使用Nokogiri创建HTML页面标记结构的大纲，我可以将其用作HTML页面内容是否已更改的指示器要做到这一点，基本上我希望去掉所有文本，只保留HTML标记（没有属性）我的想法是将其用作页面的草图，我使用的其中一个，以查看页面是否已更改完成后，我希望“草图”大致如下所示因此，可以将其与修订版进行比较，以查看页面结构是否已更改关于如何在Nokogiri中解析dom，有很多例子。但是，把它列出来怎么样有什么想法吗这样做可以： class Nokogiri::XML::N

我正在尝试使用Nokogiri创建HTML页面标记结构的大纲，我可以将其用作HTML页面内容是否已更改的指示器

要做到这一点，基本上我希望去掉所有文本，只保留HTML标记（没有属性）

我的想法是将其用作页面的草图，我使用的其中一个，以查看页面是否已更改

完成后，我希望“草图”大致如下所示

因此，可以将其与修订版进行比较，以查看页面结构是否已更改

关于如何在Nokogiri中解析dom，有很多例子。但是，把它列出来怎么样

有什么想法吗

这样做可以：

class Nokogiri::XML::Node

  def to_sketch
    children.find_all(&:element?).map(&:to_sketch).join
  end
end

class Nokogiri::XML::Element
  def to_sketch
    "<#{name}>#{super}</#{name}>"
  end
end

"<html><head><meta></meta><title></title><script></script><style></style><script></script></head><body><textarea></textarea><div><div><nobr><b></b><a></a><a></a><a></a><a></a><a></a><a></a><a><u></u></a></nobr></div><div><nobr><span></span><span></span><span><a></a></span><a></a><a></a></nobr></div><div></div><div></div></div><center><br></br><div><a><img></img></a><br></br><br></br></div><form><table><tr><td></td><td><input></input><input></input><input></input><div><input></input></div><br></br><span><span><input></input></span></span><span><span><input></input></span></span></td><td><a></a><a></a></td></tr></table></form><div><br></br><div><font><a></a><a></a><a></a></font><br></br><br></br></div></div><div></div><span><center><div><div><a></a><a></a><a></a><a></a></div></div><p><a></a></p></center></span><div></div><div><script></script></div><script></script><script></script></center></body></html>"

DOM是一种非常基本的树结构：节点包含数据（属性、文本）并具有子节点。您是否想过如何序列化（列出）该结构？想想你怎么做，并考虑用你所尝试的方法来更新你的问题。

"<html><head><meta></meta><title></title><script></script><style></style><script></script></head><body><textarea></textarea><div><div><nobr><b></b><a></a><a></a><a></a><a></a><a></a><a></a><a><u></u></a></nobr></div><div><nobr><span></span><span></span><span><a></a></span><a></a><a></a></nobr></div><div></div><div></div></div><center><br></br><div><a><img></img></a><br></br><br></br></div><form><table><tr><td></td><td><input></input><input></input><input></input><div><input></input></div><br></br><span><span><input></input></span></span><span><span><input></input></span></span></td><td><a></a><a></a></td></tr></table></form><div><br></br><div><font><a></a><a></a><a></a></font><br></br><br></br></div></div><div></div><span><center><div><div><a></a><a></a><a></a><a></a></div></div><p><a></a></p></center></span><div></div><div><script></script></div><script></script><script></script></center></body></html>"