从Web组件站点获取呈现的源代码?

时间:2015-11-18 09:09:59

标签: google-chrome firefox polymer web-component

我只是尝试了一些相当简单的事情:获取网页的源代码(通过保存)并计算代码中出现某个短语的频率。

事实证明,如果该页面使用Polymer / web组件,则无效。这是一个浏览器错误吗?

请尝试以下操作:转到http://www.google.com/design/icons/并尝试在代码中找到star_half(页面上的最后一个图标)。如果您检查Chrome或Firefox中的元素,它将引导您

<i class="md-icon dp48">star_half</i>

但如果您复制根节点或将html保存到磁盘,则不会在源代码中。

有没有办法获取整个代码?

1 个答案:

答案 0 :(得分:1)

这种行为的原因可能是源查看(以及源代码保存?)适用于浏览器,因为shadow roots附加到Web组件上客户方。

当您在网页上按ctrl-u时,浏览器基本上会在同一网址上再次进行网络通话,以获取您点击该网址时返回的服务器的副本。

在这种情况下,当this页面呈现时,浏览器会识别组件icons-layout,然后执行代码以将shadow-root附加到此节点。当您的页面到达客户端(浏览器)时,所有这些都会发生。

当您尝试保存此页面时,您正在保存返回的服务器而不是页面的当前状态。如果启动chrome控制台并尝试保存icons-layout节点,您将看到相同的行为。

  

有没有办法获取整个代码?

我不知道如何从浏览器中执行此操作,但phantomjs提供way来保存客户端呈现的html。