目录
实验室
一个发布最新功能实验/测试结果的地方，试验场在 Sandbox 沙盒区
【Matce Wiki 原创】MatceInfoBox JS 小型框架
只需在要插入MatceInfoBox的地方修改并写入如下内容即可生成样式：
<html> <script type="text/javascript"> var DetailJson = { mainTitle: "AQUOS Xx3", subTitle: "SHV34 SH-04H 506SH", operators: { "SoftBank版 506SH": { mainImg: "/wiki/MatceInfoBox/media/sharp/aquos_xx3/aquos_xx3_main.png", infobox: { "处理器": "骁龙820(MSM8996)", "内存": "3GiB", "储存": "32GB", "物理量": "重153克、尺寸149*73*76mm", "电池": "3000毫安时(mAh)", "系统": "Android 6.0/7.1/8.0", "屏尺寸": "约5.3寸(inch)", "解像度": "1080P(1920×1080) 120Hz", "屏技术": "IGZO材质 S-PureLED", "SD卡": "microSDXC 最大200GB", "后置": "约2260万像素", "前置": "约500万像素", "防护": "IP5X、IPX5、IPX8", "档期": "2016年夏 JP发行", "网络": "中国国内情报：二~四代通信(2G~4G)x1", "其他": "右侧指纹、下部两侧指示灯、单扬声器", }, colors: { "樱花粉": "/wiki/MatceInfoBox/media/sharp/aquos_xx3/506sh_1.png", "象牙白": "/wiki/MatceInfoBox/media/sharp/aquos_xx3/506sh_2.png", "孔雀蓝": "/wiki/MatceInfoBox/media/sharp/aquos_xx3/506sh_3.png", "曜石黑": "/wiki/MatceInfoBox/media/sharp/aquos_xx3/506sh_4.png", } }, "DOCOMO版 SH-04H": { mainImg: "/wiki/MatceInfoBox/media/sharp/aquos_xx3/sh04h/1.jpg", colors: { "象牙白": "/wiki/MatceInfoBox/media/sharp/aquos_xx3/sh04h_1.png", "草叶绿": "/wiki/MatceInfoBox/media/sharp/aquos_xx3/sh04h_2.png", "曜石黑": "/wiki/MatceInfoBox/media/sharp/aquos_xx3/sh04h_3.png", } }, "Au版 SHV34": { mainImg: "/wiki/MatceInfoBox/media/sharp/aquos_xx3/shv34/1.jpg", infobox: { "其他": "无指纹、下部两侧指示灯、单扬声器", }, colors: { "深海蓝": "/wiki/MatceInfoBox/media/sharp/aquos_xx3/shv34_1.png", "象牙白": "/wiki/MatceInfoBox/media/sharp/aquos_xx3/shv34_2.png", "樱花粉": "/wiki/MatceInfoBox/media/sharp/aquos_xx3/shv34_3.png", } }, } } </script> <script type="text/javascript" src="/wiki/MatceInfoBox/script.js"></script> </html>
【新版】检索页面名词跳转 · Wiki页面重定向
P.s. 很多人只熟悉诸如 605SH 这样的运营商机型号，却不熟悉其机型名 AQUOS R。为了方便萌新的检索，在保证页面地址名简洁（地址只写机型名如 aquos_r）前提下，使得搜索如 605sh 这样的运营商机型号可以出现匹配的 Wiki 页面，现给出了目前的解决方案：检索页面名词跳转 · Wiki页面重定向
【以建立 Sharp Aquos R 的页面重定向为例】
一、访问 matce.cn/wiki/doku.php/redirect/你要新建的重定向网页名 并新建该页面 |
例如：matce.cn/wiki/doku.php/redirect/aquos_xx3-shv34-sh04h-506sh
| 二、在该页面内写下【如下方所示文字】 |
#redirect sharp:aquos_xx3
| 三、再次返回原先你要新建的重定向网页名那个编辑页面，再次保存 |
| 四、直接搜索 605sh 检验是否匹配页面，无效则重新来一遍 |
JS 函数动态更改 HTML 伪类 的 CSS Style 样式 [ 单个伪类单个控制，不会无限增加 <style> 标签 ]
/* ----【函数】更改伪类CSS样式---- */ function ChangePseudoClassStyle(PseudoClassCSSName, CSSText) { //伪类名 例"a:after", 新样式 var PseudoClassCSSID = PseudoClassCSSName; // 设置控制伪类的<style>的ID值为伪类名 /* ----【子函数】生成新的<style>---- */ var css = function(t) { var s = document.createElement('style'); s.id = PseudoClassCSSID; s.innerText = t; document.body.appendChild(s); }; /* ----查找旧的<style>并删除，防止CSS越建越多，随着函数触发无限增长---- */ var PCS = document.getElementById(PseudoClassCSSName); if (PCS != null) { PCS.remove(); } css(PseudoClassCSSName + ' {' + CSSText + '}'); // 填入传入的CSS文本 // 保留CSS文本例子：css('p:after {color:red; content:\'[我变红了]\'}'); };
AW多视频iframe框架Bilibili播放器 Ver 1.0
<div id="PVbox"> <iframe id="PVplayer" src="" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" width="315px" height="177.1875" style="background: grey"> </iframe> <div id="PVbox_TabBox" class="PVTabBox"> <style> .PVTabBox { height: max-content; display: flex; background: whitesmoke; margin-top: -20px; } .PVtab { width: -webkit-fill-available; display: flex; padding: 10px 0; justify-content: center; font-size: 14px; outline: none;/*不显示轮廓线*/ cursor: pointer;/*鼠标移入按钮范围时出现手势*/ background: #f5f5f5; color:#656565; border-style: none; border-radius: 0; } </style> <!-----------------视频按钮Tab列表 开始-----------------> <button class="PVtab" onclick="TabOnClick( '//player.bilibili.com/player.html?aid=89589035&bvid=BV1w7411J7ez&cid=153014802&page=1' )"> <!-- ↑上方''内填入要设置的Bilibili视频<iframe>的src链接--> ▶官方宣传片</button> <button class="PVtab" onclick="TabOnClick( '//player.bilibili.com/player.html?aid=89590166&bvid=BV1w7411J7V3&cid=153017005&page=1' )"> <!-- ↑上方' '内填入要设置的Bilibili视频<iframe>的src链接--> ▶网络广告</button> <button class="PVtab" onclick="TabOnClick( '//player.bilibili.com/player.html?aid=89591873&bvid=BV1P7411J7Fw&cid=153018496&page=1' )"> <!-- ↑上方''内填入要设置的Bilibili视频<iframe>的src链接--> ▶要点介绍</button> <!--↑视频超过三个？看到上面三个button按钮是不是长得很像，再复制一段<button>到</button>的代码于本列表末，相当于新建按钮 ↑视频不足三个？关闭多余的button按钮，只需要在需要关闭的<button>到</button>之外用/* */来包住它即可（注释掉它）， 示例： /*<button> 代码内容 </button>*/ --> <!-----------------视频按钮Tab列表 结束-----------------> </div> </div> <script type="text/javascript"> var PVplayer = document.getElementById("PVplayer") var PVtab = document.getElementsByClassName("PVtab") PVtab[0].onclick(); //↑默认选择第一个tab代表的视频进行播放，这句相当于模拟用户点击了第一个视频 ChangeWorkingTabColor(); function ChangeWorkingTabColor() { //↑负责设定tab选中时的样式的function for(var i = 0; i < PVtab.length; i++){ ThisAID = PVtab[i].getAttribute("onclick"); ThisAID = ThisAID.match(/aid=(\S*)&bvid/)[1]; //↑在onclick功能（此时是字符串形式）里找视频aid码，保存给ThisAID PVplayerAID = PVplayer.src; PVplayerAID = PVplayerAID.match(/aid=(\S*)&bvid/)[1]; //↑在iframe播放模块的src值里（此时是字符串形式）里找视频aid码，保存给PVplayerAID PVtab[i].onmouseover = function() { //tab鼠标悬停效果 this.style.background="#7fcac3"; this.style.color="#fff"; } PVtab[i].onmouseout = function() { //tab鼠标移出效果 this.style.background="#f5f5f5"; this.style.color="#656565"; } if(ThisAID == PVplayerAID){ //↑判断当前for循环内，PVtab[i]代表的视频，是否与iframe播放模块所播放的一致，如果一致，就让tab突出显示（通过加深它的颜色来突出此时播放的视频是属于哪一个tab的） PVtab[i].style.backgroundColor='#009688'; PVtab[i].style.color = '#fff'; PVtab[i].onmouseover = null; PVtab[i].onmouseout = null; } else{ //不一致则恢复tab常规样式（未选中时的样式） PVtab[i].style.backgroundColor='#f5f5f5'; PVtab[i].style.color = '#656565'; } } } //PVtab点击事件 function TabOnClick(vSRC){ vSRC = deBugSRC(vSRC); setPlayerSRC(vSRC); ChangeWorkingTabColor(); } //检测与修正从B站复制到的src缺少https:的BUG function deBugSRC(dbSRC){ if(dbSRC.indexOf("https:") == -1){ //-1代表该src链开头缺少https: dbSRC = "https:" + dbSRC } //alert(dbSRC); return dbSRC; } //给PVplayer设置或更换src function setPlayerSRC(vSRC){ //alert(vSRC) var PVplayer = document.getElementById("PVplayer") if(PVplayer.src != vSRC){ PVplayer.src = vSRC; } } </script>
命名空间默认模板页
可以使用两种模板文件：
_template.txt，在当前名称空间中使用。__template.txt（两个下划线），除了可以在下面的所有命名空间中使用（它们都是继承的）之外，它们还可以用作普通_template.txt文件 。
如果命名空间中同时存在（继承的和常规的）模板，则采用常规的模板。
插件可以通过配置管理器选择更改 _template 和 __template 的名称。 默认分别为
c_template 和 i_template 。 该插件可让您选择普通的Wiki页面作为模板，以便可以通过Wiki界面对其进行编辑。
动态文字写法：
| @ID@ | 完整的页面 ID |
|---|---|
| @NS@ | 页面的 命名空间 名称 |
| @PAGE@ | 页面名称 (不含分类名称，且下底线会被置换为空白) |
| @!PAGE@ | 同上，但第一个字母为大写 |
| @!!PAGE@ | 同上，但每个字的第一个字母为大写 |
| @!PAGE!@ | 同上，但所有字母均为大写 |
| @FILE@ | 页面名称（不含分类名称，且下底线维持原样） |
| @!FILE@ | 同上，但第一个字母为大写 |
| @!FILE!@ | 同上，但所有字母均为大写 |
| @USER@ | 建立这页面的使用者帐号 |
| @NAME@ | 建立这页面的使用者名称 |
| @MAIL@ | 建立这页面的使用者 E-Mail |
| @DATE@ | 开始建立、编辑页面的日期和时间 |
在 Wiki 中插入 Bilibili 视频
| 一、实例 |
Sharp Aquos R 的官方PV
| 二、在wiki编辑里的写法 |
<html> <iframe src="//player.bilibili.com/player.html?aid=9924843&cid=16407551&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" width="100%" height="480"> </iframe> </html>
| 三、但是在信息栏中，我们需要将视频播放窗口改小，并且符合16：9的视频尺寸，从而使手机端视频略缩图不至于拉伸变形，又能实现手机端视频无缝嵌入页面的效果。实例和代码如下 |
Sharp Aquos R 的官方PV
| 基本规格 | |
| 类型 | 参数 |
|---|
<WRAP right 300px> Sharp Aquos R 的官方PV <html> <iframe src="//player.bilibili.com/player.html?aid=9924843&cid=16407551&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" width="300" height="168.75"> </iframe> </html> | 基本规格 | ^ 类型 | 参数 | </WRAP>
| 四、代码中 <iframe 到 </iframe> 片段获取方式 |
使用 PC 端的任意现代浏览器打开你要嵌入的 bilibili 视频的播放页，然后点击下方的分享按钮，并将“嵌入代码”右边的那段代码复制，那段代码即是 Wiki 代码中 <iframe 到 </iframe> 初始片段。
▲别忘了在 </iframe> 前加上控制宽高的代码 width=“宽度数值或百分比” height=“高度数值”。操作如图所示。