hexo-bilibili-bangumi
Version:
77 lines (72 loc) • 3.06 kB
JavaScript
/*
* @Author : HCLonely
* @Date : 2024-09-11 15:40:57
* @LastEditTime : 2025-07-09 20:36:01
* @LastEditors : HCLonely
* @FilePath : /hexo-bilibili-bangumi/src/lib/templates/index.js
* @Description : 前端页面交互脚本,实现标签页切换和分页加载功能。
* 包含自定义DOM操作方法、标签页点击事件处理,以及
* 通过AJAX异步加载更多数据的分页功能。
*/
(function () {
Element.prototype.siblings = function () {
const siblingElement = [];
const sibs = this.parentNode.children;
for (let i = 0; i < sibs.length; i++) {
if (sibs[i] !== this) {
siblingElement.push(sibs[i]);
}
}
return siblingElement;
};
function tabClick() {
// 修改标签样式
this.classList.add('bangumi-active');
let sibs = this.siblings();
for (let j = 0; j < sibs.length; j++) {
sibs[j].classList.remove('bangumi-active');
}
// 显示对应板块
const itemId = this.id.replace('tab', 'item');
const target = document.getElementById(itemId);
target.classList.remove('bangumi-hide');
target.classList.add('bangumi-show');
sibs = document.getElementById(itemId).siblings();
for (let k = 0; k < sibs.length; k++) {
sibs[k].classList.remove('bangumi-show');
sibs[k].classList.add('bangumi-hide');
}
}
const tabs = document.getElementsByClassName('bangumi-tab');
for (let i = 0; i < tabs.length; i++) {
tabs[i].onclick = tabClick;
tabs[i].onclick.apply(tabs[i]);
}
if (typeof hexoBilibiliBangumiOptions.pagenumsPre !== 'undefined') {
axios.get(new URL('../bangumis.json', window.location.href)).then((response) => {
if (response.data) {
const html = {
wantWatch: response.data.wantWatch.slice(10).map((item) => hexoBilibiliBangumiOptions.pug.render(hexoBilibiliBangumiOptions.pugTemplate, {
item,
...hexoBilibiliBangumiOptions.pugOptions
}))
.join('\n'),
watching: response.data.watching.slice(10).map((item) => hexoBilibiliBangumiOptions.pug.render(hexoBilibiliBangumiOptions.pugTemplate, {
item,
...hexoBilibiliBangumiOptions.pugOptions
}))
.join('\n'),
watched: response.data.watched.slice(10).map((item) => hexoBilibiliBangumiOptions.pug.render(hexoBilibiliBangumiOptions.pugTemplate, {
item,
...hexoBilibiliBangumiOptions.pugOptions
}))
.join('\n')
};
document.querySelectorAll('#bangumi-item1>.bangumi-pagination')[0].insertAdjacentHTML('beforeBegin', html.wantWatch);
document.querySelectorAll('#bangumi-item2>.bangumi-pagination')[0].insertAdjacentHTML('beforeBegin', html.watching);
document.querySelectorAll('#bangumi-item3>.bangumi-pagination')[0].insertAdjacentHTML('beforeBegin', html.watched);
}
});
}
document.getElementsByClassName('bangumi-tab')[hexoBilibiliBangumiOptions.show].click();
}());