// ==UserScript==
// @name         b站首页清爽版
// @namespace    http://tampermonkey.net/
// @version      1.2.1
// @description  这是一个清爽版b站首页的脚本，可以使得首页只有首页推荐
// @author       Waflare
// @match        https://www.bilibili.com/
// @icon         https://www.google.com/s2/favicons?domain=bilibili.com
// @grant        GM_addStyle
// @grant        GM_xmlhttpRequest
// @require      https://code.jquery.com/jquery-3.6.0.js
// @license      GPL
// @downloadURL none
// ==/UserScript==

(function() { 'use strict'; function getFrontPage() { let url = 'https://api.bilibili.com/x/web-interface/index/top/rcmd?fresh_type=3'; return new Promise((resolve, reject) => { GM_xmlhttpRequest({ method: 'GET', url: url, onload: (r) => { let result = JSON.parse(r.response).data.item; resolve(result); } }) }) } function getTemplate(item) { return ` <div class='w_item' id='${item.bvid}'> <div class='w_img_box'> <img src='${item.pic}' /> </div> <div class='w_footer'> <div class="w_face"> <img src='${item.owner.face}' /> </div> <div class='w_detail'> <div class='w_title'>${item.title}</div> <div class='w_up'>${item.owner.name}</div> <div class='w_stat'> <div>${formatNum(item.stat.view)}次观看</div> <div>${formatNum(item.stat.like)}个点赞</div> </div> </div> </div> </div> ` } function gotoPage(url) { let _url = url; return function() { console.log(_url); window.open(_url, '_blank'); } } async function formatData() { let data_1 = await getFrontPage(); let data_2 = await getFrontPage(); let data = [...data_1, ...data_2]; console.log(data); $('#internationalHeader').after(` <div id="w_body"> <div id="w_content"></div> </div> `); for (let item of data) { $('#w_content').append(getTemplate(item)); $(`#${item.bvid}`).on('click', gotoPage(item.uri)); } $('#w_body').append('<div id="w_btn">更多</div>'); $('#w_btn').on('click', moreVideo); } async function moreVideo() { let data = await getFrontPage(); for (let item of data) { $('#w_content').append(getTemplate(item)); $(`#${item.bvid}`).on('click', gotoPage(item.uri)); } } formatData(); function formatNum(num) { if (!num) { return '0'; } if(num < 10000) { return num.toString(); } else { return (num / 10000).toFixed(1).toString() + '万'; } } GM_addStyle(` .international-home { min-height: 100vh; } .international-home .storey-box { display: none; } .international-home .first-screen { display: none; } #w_body { display: flex; flex-direction: column; align-items: center; margin-bottom: 20px; } @media screen and (max-width: 1870px) { #w_content, #w_btn { width: 1414px !important; } .w_item { width: 270px !important; } } @media screen and (max-width: 1654px) { #w_content, #w_btn { width: 1198px !important; } .w_item { width: 225px !important; } } @media screen and (max-width: 1438px) { #w_content, #w_btn { width: 999px !important; } .w_item { width: 186px !important; } } #w_content { max-width: 1610px; display: flex; justify-content: flex-start; flex-flow: wrap; } .w_item { width: 310px; margin-bottom: 10px; display: flex; flex-direction: column; margin-left: 10px; } .w_item:hover { cursor: pointer; } .w_item > .w_img_box{ position: relative; overflow: hidden; padding-top: 62.5%; background-image: url('https://i.w3tt.com/2021/12/05/BAH9l.png'); } .w_img_box > img { position: absolute; top: 0; left: 0; width: 100%; } .w_item > .w_detail { width: 100%; } .w_footer { display: flex; } .w_footer > .w_face { width: 56px; padding: 10px; box-size: border-sizing; } .w_footer > .w_detail { flex: 1; } .w_face > img { width: 36px; height: 36px; border-radius: 50%; } .w_detail > .w_title { width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 16px; line-height: 22px; border-top: 10px solid transparent; border-bottom: 5px solid transparent; } .w_detail > .w_up { font-size: 14px; color: #606060; } .w_detail > .w_stat { font-size: 12px; color: #606060; line-height: 18px; display: flex; justify-content: space-between; } #w_btn { max-width: 1630px; width: 100%; height: 50px; border-radius: 8px; line-height: 50px; font-size: 16px; text-align: center; color: #9999b2; font-weight: 600; background-color: #f6f9fa; margin-left: 10px; } #w_btn:hover { cursor: pointer; } `) })();