美文网首页
花瓣网瀑布流(滚动加载)采集思路详解

花瓣网瀑布流(滚动加载)采集思路详解

作者: 八维数据 | 来源:发表于2019-03-05 21:27 被阅读0次

瀑布流,又称瀑布流式布局。是比较流行的一种网站页面布局。视觉表现为,随着页面滚动条向下滚动,这种布局还会不断加载数据块并附加至当前尾部,没有特有的分页按键。

那么如何分析瀑布流数据呢?

上图箭头那边,是一个 加载更多,似乎和瀑布流不太一样,实际道理是一样的,多是找不到含有分页代码的效果,那这种情况下,我们应该怎么做那? 

首先,工具只要使用任意一款浏览器,我这边是2345浏览器,有需要使用的可以点击下载。

按快捷键F12,跳出下框,点击Network。

点击 加载更多,下面的框内会出现大量数据,这里就是我们要找的数据的 地方。


在这个数据框内,要找到加载数据的那个接口链接,其实很简单,首先把下拉框拉到最上面,然后点击每一个链接进行查看数据,是否是我们需要的内容。从数据框内看到page=2这个关键词,我们多知道,下一页一般在网页中大多会使用page这个词做链接的 ,也就是我们在这里直接可以查看这个page=2的链接内容是不是我们要找的数据。


我们点击这个链接后,右边框内,点上面的 Preview,查看数据,里面的数据,可以自己随便点击一个小箭头,打开看一下内容,就能确定,这里的数据就是我们要找的网页里加载的数据了。

这个 page=2的链接 也就是一个 分页代码的其中一页 ,链接:http://huaban.com/?page=2

这个里的 2  就是 分页的数字,我们可以继续点击 加载更多,看一下,我们的判断对不对

好了,这个瀑布流的链接查找方法就讲到这里,希望大家能理解。

投稿人:八维数据

相关文章

  • 花瓣网瀑布流(滚动加载)采集思路详解

    瀑布流,又称瀑布流式布局。是比较流行的一种网站页面布局。视觉表现为,随着页面滚动条向下滚动,这种布局还会不断加载数...

  • 瀑布流_懒加载_ajax结合使用

    整体的布局是瀑布流效果,然后滚动到底部进行懒加载。大体的实现思路: 获取数据 将数据变为DOM,然后通过瀑布流(绝...

  • waterfall瀑布流布局+动态渲染

    瀑布流典型网站 花瓣网、堆糖 [目录] 瀑布流布局原理大体思路具体思路 插件封装(5步) 动态渲染需求分析渲染第一...

  • 瀑布流div版

    瀑布流 瀑布流是一种网站页面布局,视觉表现为参差不齐的多栏布局,随着页面滚动条向下滚动,这种布局还会不断加载数据块...

  • Jquery 瀑布流(滚动加载)

    源码下载地址 实现思路 通过容器宽度 和每列的宽度 可以计算出列数。 数组来保存每一列的高度,当页面加载新的盒子时...

  • vue上拉加载List 列表

    介绍 Vant框架瀑布流滚动加载,用于展示长列表,当列表即将滚动到底部时,会触发事件并加载更多列表项。 在main...

  • UICollectionView的使用

    瀑布流 横向滚动

  • 滚动加载的瀑布流效果

    需要jq的支持哦 也可以自己写原生js

  • iOS 瀑布流基本实现

    一、瀑布流设计方案 二、瀑布流设计思路分析 1、自定义流水布局中,指定滚动方向、默认列数、行间距、列间距、以及指定...

  • 原生JS实现照片瀑布流与懒加载

    什么是瀑布流和懒加载 瀑布流是目前比较流行的一种网站页面布局,会在网页上呈现参差不齐的多栏布局,页面向下滚动,网页...

网友评论

      本文标题:花瓣网瀑布流(滚动加载)采集思路详解

      本文链接:https://www.haomeiwen.com/subject/vfkfpqtx.html