目錄

前端小試身手(1)--幫「發問/發文頁」新增"編輯"鈕～

前端小試身手(2)--it幫跳轉到最佳解答

前端小試身手(3)--增添系列文目錄

前端小試身手(4)--it幫發文「一眼全覽」

前端小試身手(5)-備份it幫的發問！

前端小試身手(6)--IMG複製大師，懶人專用小腳本

前端小試身手(7)--迷片靜音神隊友，讓你尷尬不再有！

前端小試身手(8)--教你寫出「思想審查警衛」，過濾垃圾雜訊的利器！

前端小試身手(9)--文章縮圖預覽(以codeLove論壇為例)

前情提要

有時候，夜深人靜，總是會想要沉思人生的意義。
於是打開某個網站，
開始看一些只有長大了才能看的大人動作愛情學，必須好好鑽研，
此刻電影裡的聲響徹雲霄，你感覺無比尷尬.....

這時候就需要靜音神隊友。

可以自己加入網頁名單，讓小電影們先保持靜音，自己再手動開啟。
如此一來非常保險，絕對不讓你不小心爆音。
非常的有禮貌，人生的哲理更奧妙了。

腳本下載

https://greasyfork.org/zh-TW/scripts/477196-%E9%9D%9C%E9%9F%B3%E5%B0%8F%E5%8A%A9%E6%89%8B

JS程式碼

// ==UserScript==
// @name         靜音小助手
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        https://*/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=xvideos.com
// @grant        none
// ==/UserScript==

// 定義 JSON 資料，包含網址開頭
var jsonUrls = [
  "https://www.xvideos.com/",
  "https://example.com/json2",
  // 添加更多的網址開頭
];

// 取得當前網址
var currentUrl = window.location.href;

// 檢查當前網址是否以 JSON 中的某些開頭開始
var isJsonUrl = jsonUrls.some(function(jsonUrl) {
  return currentUrl.startsWith(jsonUrl);
});

// 如果當前網址符合 JSON 的某些開頭，執行程式碼
if (isJsonUrl) {
  // 在這裡放置你想要執行的程式碼
  console.log("當前網址符合 JSON 開頭");
  Mute();
} else {
  console.log("當前網址不符合 JSON 開頭");
}

function Mute(){
// 取得網頁上所有的 <video> 元素
var videoElements = document.getElementsByTagName('video');

// 迭代所有的 <video> 元素並將其靜音
for (var i = 0; i < videoElements.length; i++) {
  videoElements[i].muted = true;
}
}

觀念筆記

只能說，前端的東西往往越簡單，越強。

這次只是使用三個小觀念，都是超級基本的小小觀念，幼稚園等級。

第一部分：使用陣列儲存網址

// 定義 JSON 資料，包含網址開頭
var jsonUrls = [
  "https://www.xvideos.com/",
  "https://example.com/json2",
  // 添加更多的網址開頭
];

這部分就是把我們的資料儲存起來，可以自己新增訂義哪些網址要被匹配。

第二部分：location的API

使用網址要確認網址，就是用location，這已經屢見不鮮。
另外字串的搜查，startsWith非常老舊卻也很無敵。

第三部分：影片靜音API

很簡單，針對video元素muted就可以了，非常輕鬆！
簡直就像早餐吃鬆餅一樣，鬆。

心得

很多人常常說前端，好難，JS好基八
我是覺得，關你屁事？/ᐠ｡ꞈ｡ᐟ
你會罵蛋餅為什麼要這麼蛋餅嗎，蛋餅之所以好吃就是因為它是蛋餅，不好吃也因為它是蛋餅。

JS的奇怪或是難懂，只是它的本質，在那邊靠北靠母的風氣真的很無聊。
要玩梗也可以多一點新的梗，而不是表面嘴皮耍耍。
它很機八，但也很強，這就是JS的厲害之處。

因此這個簡單實用的小腳本，又再次被我們秒殺了！
喜歡可以關注，未來還會有更多JS的小試身手、前端動手玩創意也還有一堆素材呢⁽⁽٩(๑˃̶͈̀ ᗨ ˂̶͈́)۶⁾⁾