上一篇文章「年更博主冒个泡,或将开启可视化之旅」发布后,看到有人评论“催更催更,等下一篇”、“失踪人口回归”,还是挺开心的,没想看居然还有人看,不由感慨「终于等到我,还好你们没放弃」
,doge。
这次重新开始更新也顺带建了个交流群,目前群里人还不多,但很惊喜的是,有位「在美可视化爱好者」对我上篇文章里涉及的 data viz
领域的创作者如 Nadieh Bremer/Shirley Wu/Amelia Wattenberger
,以及 datasketch
等项目都很了解,而且他还告诉我 D3.js v6
出了,后来我也上推特看到了,并看了下 GitHub 更新说明:Changes in D3 6.0
国内搞D3.js可视化的人感觉并不多,没想到能这么快找到同好,也是桩开心事。
这回想分享的是之前学到的一个「骚操作」
,可以快速的对网页数据进行处理计算。
对懂技术的人来说,自然很简单不值一提,不同技术背景的人可能也会有不同的实现方式。
要是搁以前,估计我也不会专门写这类文章......所以我就鸽了14个月没更新,doge,(这个自黑的梗倒是蛮好用)。
但最近自己的观念也发生了变化,毕竟关注我的人里应该还是很多人不会编程的,那么借这个机会让他们看看,我有某个小需求时是如何处理的;同时,我也好奇如果是他们会如何处理,有什么其他我不知道的高效方法,可以评论分享下。
当然这里并不会完全解释每一步的含义与代码为什么这么写,小白可以看看如何操作即可,这样以后找身边的「工具人」程序员小哥哥小姐姐时,也能门儿清的说出口 XXX,对你来说这个很简单几分钟就能搞定,帮我个忙呗
,多么熟悉且悦耳的话语,doge。
某一天,因为某些以后会讲的原因,我想统计下「李子柒」
YouTube频道里所有视频的累计播放量和累计视频总长度。
假如没学 JavaScript 的话,我应该会用 Python 爬虫实现。但学过 JavaScript 并了解到 Chrome 开发者工具里用 $$()
就能直接获取页面元素后,就不需要写爬虫获取页面再抽取数据,而是直接抽取并处理计算即可。
于是将页面拖到最底部,加载出所有视频列表。右键选中「检查」/「审查元素」
,或者 Mac 快捷键 Command+Shift+C
打开 Chrome 开发者工具,选中要抽取的元素,比如图中单个视频时长的 5:01
。
确定数据是在 span.ytd-thumbnail-overlay-time-status-renderer
标签里后,用 $$()
选中,然后遍历输出文本内容,确实就是要的数据。
$$('span.ytd-thumbnail-overlay-time-status-renderer').forEach(el => console.log(el.innerHTML.trim()))
接着用 JavaScript 数组遍历中的 reduce()
方法,将每项数据拆成分和秒,再统一以秒进行累加,即可得到视频总长度为 51742秒
, 约 14.37小时
。
$$('span.ytd-thumbnail-overlay-time-status-renderer').reduce((sum, el) => {
let item = el.innerHTML.trim()
let min = +item.split(':')[0]
let sec = +item.split(':')[1]
return sum + min * 60 + sec
}, 0)
同样的方式,计算出累计播放量约 173833万次
。
$$('span.ytd-grid-video-renderer:first-child').forEach(el => console.log(el.innerHTML.trim()))
$$('span.ytd-grid-video-renderer:first-child').reduce((sum, el) => {
let playNum = +el.innerHTML.replace('万次观看', '');
return sum + playNum;
}, 0)
随便 Google 找个有对 YouTube 频道进行评估的网站,可以看到播放量也是在17.4亿次
左右,和上述结果差不多。
按照不少人的说法,YouTube 视频100万次播放量收益3千美元
计算的话,李子柒全部视频17.4亿
播放量的收益折算成人民币大概3583万元
。
不算不知道,一算吓一跳,当然实际比这高还是低,大家可以发表看法。感觉只高不低。
以上就是想分享的一个不用写爬虫,也能很方便对一些网页进行处理计算的操作
。
会者不难,难者不会。
我也好奇不会编程的小伙伴平时要是遇上类似的问题或需求,会怎么解决,有其它好的方法的话,也可以分享下。