Girls Page Setup
hexo-theme-yun 这个主题有个特别的页面:页面配置|Girls。白用白不用嘛,就打算弄个诺贝尔奖女性获奖者名单上去。 也算是一点小小的反抗。
现在从 hexo 搬迁至 nikola 了,但是并不想把这个页面抛荒,于是自己写了 html 和样式,现在看着还行。 /pages/girls/
(对了,今年诺奖也出了,争取找点时间来更新一下
抓取过程¶
但是好麻烦啊,我写代码又垃圾
反正没打算弄成可复用的,最后大概路径是: 1. 到官方的 Nobel Prize awarded women 页面; 2. 打开 F12 开发者工具,大概在控制台弄了以下的代码:
var article = document.getElementById("nobel-middle-col");
var links = Array.prototype.slice.call(article.getElementsByTagName("a"))
.filter(function(link) { return link.href.includes("facts"); });
var all = [];
for(var i in links) {
var href = links[i].href;
if(href) {
(function(i, href) {
fetch(href).then(function(response) {
return response.text();
}).then(function(html) {
var parser = new DOMParser();
var doc = parser.parseFromString(html, "text/html");
var img = doc.getElementsByTagName("picture")[0]
.getElementsByTagName("source")[0].getAttribute("data-srcset");
var reasons = links[i].parentElement.innerText;
var prize = reasons;
if(reasons.indexOf("\n") != -1) {
prize = reasons.substring(0, reasons.indexOf("\n"));
}
var person = {
name: links[i].innerText,
avatar: img,
reason: reasons,
url: href,
from: prize
};
all.push(person);
});
})(i, href);
}
}
- 然后在控制台
console.log(all)
,复制变量到在线的随便哪个 JSON 转 YAML 转换器那里转换,把转换结果放回 girls 页面里。
顺便提一句,其实诺贝尔奖官网似乎提供了一些 API 可以查询相关的很多很多信息。但是 API 查不到图片,不符合我的要求,所以就没用。
Reference: Nobel Prize awarded women. NobelPrize.org. Nobel Media AB 2020. Tue. 4 Aug 2020. https://www.nobelprize.org/prizes/lists/nobel-prize-awarded-women
评论