【JS工具】B站视频转载到Typecho文章
效果展示:
安装
1、下载脚本video.zip,上传并解压到当前主题的目录(例如:usr/themes/default/)
2、使用后台编辑当前主题的header.php文件,并加入以下PHP代码至<header></header>标签之间
<script src="<?php $this->options->themeUrl('video/util.js'); ?>"></script>
<link rel="stylesheet" href="<?php $this->options->themeUrl('video/util.css'); ?>">
文章内使用
把以下代码复制到文章中,修改"xxxxxxxx"部分为B站视频的BVid即可。
<div class="bilibili" :bv="xxxxxxxx"></div>
功能原理
添加JS脚本至所有页面,由前端(浏览器)执行。
打开页面时扫描所有包含bilibili的class的div元素,根据BVid向B站API请求视频数据。
根据返回数据,添加封面图片到div元素,并添加点击切换播放器事件。