收起或展開嗨皮漫畫評論區，並隱藏一些無關的元素。
目前為
// ==UserScript==
// @name 嗨皮漫畫 - 收起、展開評論區
// @name:zh-TW 嗨皮漫畫 - 收起、展開評論區
// @name:zh-CN 嗨皮漫画 - 收起、展开评论区
// @name:ja ハッピーコミック - コメントエリアの折りたたみと展開
// @name:en Happy Comics - Collapse and Expand Comments Section
// @version 1.14
// @description 收起或展開嗨皮漫畫評論區，並隱藏一些無關的元素。
// @description:zh-TW 收起或展開嗨皮漫畫評論區，並隱藏一些無關的元素。
// @description:zh-CN 收起或展开嗨皮漫画评论区，并隐藏一些无关的元素。
// @description:ja Happy Comicsのコメントエリアを折りたたみ、展開し、関連のない要素を非表示にします。
// @description:en Collapse or expand the comments section of Happy Comics, and hide some irrelevant elements.
// @author Scott
// @match *://m.happymh.com/reads/*
// @grant unsafeWindow
// @grant GM_addStyle
// @license MIT
// @namespace https://www.youtube.com/c/ScottDoha
// ==/UserScript==
(function () {
'use strict';
// 檢查按鈕狀態是否已從本地存儲中獲取為收起
var isCollapsed = localStorage.getItem('isCollapsed') === 'true';
// 創建並添加懸浮提示文字的 CSS 樣式
var style = document.createElement('style');
style.textContent = `
.pagetual_tipsWords {
font-size: 20px;
font-weight: bold;
font-family: "黑體", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
color: #ffffff;
min-height: 50px;
max-width: 80%;
line-height: 1.5;
position: fixed;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 2147483647;
background-color: rgba(0, 0, 0, 0.8);
border: 1px solid #303030;
border-radius: 10px;
padding: 10px;
opacity: 0;
pointer-events: none;
text-align: center;
word-break: break-all;
transition: opacity 0.8s ease-in-out;
white-space: nowrap;
}
`;
document.head.appendChild(style);
// 找到所有的 jss48 元素並添加按鈕
var targetElements = document.querySelectorAll('.jss48');
targetElements.forEach(function (element) {
addToggleButton(element);
});
// MutationObserver 用於檢測 DOM 變化
var observer = new MutationObserver(function (mutations) {
mutations.forEach(function (mutation) {
var addedNodes = mutation.addedNodes;
for (var i = 0; i < addedNodes.length; i++) {
var addedNode = addedNodes[i];
// 檢查是否為需要添加按鈕的目標元素
if (addedNode.classList && addedNode.classList.contains('jss48')) {
addToggleButton(addedNode);
}
}
});
// 隱藏無用的 .jss7 元素
var jss7Div = document.querySelector('.jss7');
if (jss7Div) {
jss7Div.style.display = 'none';
}
// 隱藏廣告元素 .jss79
var jss79Div = document.querySelector('.jss79');
if (jss79Div) {
jss79Div.style.display = 'none';
}
// 隱藏廣告元素 #google_pedestal_container
var googlePedestalContainer = document.querySelector('#google_pedestal_container');
if (googlePedestalContainer) {
googlePedestalContainer.style.display = 'none';
}
// 切換評論區的顯示狀態
toggleComments();
});
// 開始觀察整個文檔的變化
observer.observe(document.body, { childList: true, subtree: true });
// 添加切換按鈕的函數
function addToggleButton(targetElement) {
var newLabel = createToggleLabel(); // 創建切換按鈕
var existingLabel = targetElement.querySelector('.MuiFormControlLabel-root.jss32'); // 獲取現有按鈕
if (existingLabel) {
// 將新按鈕插入到現有按鈕的後方
existingLabel.parentNode.insertBefore(newLabel, existingLabel.nextSibling);
} else {
// 如果沒有找到現有按鈕，就插入到第一個子節點後面
targetElement.appendChild(newLabel);
}
}
// 創建切換按鈕標簽的函數
function createToggleLabel() {
var newLabel = document.createElement('label');
newLabel.className = 'MuiFormControlLabel-root jss32'; // 確保樣式類名與其他樣式一致
newLabel.innerHTML = `
<span class="MuiSwitch-root">
<span class="MuiButtonBase-root MuiIconButton-root jss51 MuiSwitch-switchBase MuiSwitch-colorSecondary ${isCollapsed ? 'Mui-checked' : ''}" aria-disabled="false">
<span class="MuiIconButton-label">
<input class="jss54 MuiSwitch-input" name="checkedA" type="checkbox" ${isCollapsed ? '' : 'checked'}>
<span class="MuiSwitch-thumb"></span>
</span>
<span class="MuiTouchRipple-root"></span>
</span>
<span class="MuiSwitch-track"></span>
</span>
<span class="MuiTypography-root MuiFormControlLabel-label MuiTypography-body1">${getLabelText()}</span>
`;
// 監聽按鈕點擊事件
newLabel.querySelector('.MuiIconButton-root').addEventListener('click', function () {
isCollapsed = !isCollapsed;
localStorage.setItem('isCollapsed', isCollapsed);
updateButton(newLabel);
toggleComments(); // 切換評論區的顯示狀態
console.log('按鈕被點擊了！當前狀態為：' + (isCollapsed ? '收起' : '展開'));
showTooltip(isCollapsed ? '評論區已隱藏' : '評論區已顯示');
});
return newLabel;
}
// 更新切換按鈕的樣式和文字
function updateButton(label) {
var button = label.querySelector('.MuiButtonBase-root');
if (isCollapsed) {
button.classList.add('Mui-checked');
} else {
button.classList.remove('Mui-checked');
}
label.querySelector('.MuiTypography-root').textContent = getLabelText();
}
// 獲取按鈕文字
function getLabelText() {
return isCollapsed ? '吐槽已收起' : '吐槽已展開';
}
// 切換評論區的顯示狀態
function toggleComments() {
// 選擇兩種類型的評論區元素
var commentSections = document.querySelectorAll(
'.MuiPaper-root.MuiCard-root.jss31.jss49.jss33.MuiPaper-elevation3.MuiPaper-rounded, ' +
'.MuiPaper-root.MuiCard-root.jss31.jss49.MuiPaper-elevation3.MuiPaper-rounded'
);
commentSections.forEach(function (section) {
section.style.display = isCollapsed ? 'none' : 'block';
});
}
// 顯示懸浮提示文字的函數
function showTooltip(text) {
var tooltip = document.createElement('div');
tooltip.textContent = text;
tooltip.classList.add('pagetual_tipsWords');
document.body.appendChild(tooltip);
tooltip.style.left = '50%';
tooltip.style.top = '50%';
tooltip.style.transform = 'translate(-50%, -50%)';
tooltip.style.opacity = '0.6';
setTimeout(function () {
tooltip.style.opacity = '0';
setTimeout(function () {
document.body.removeChild(tooltip);
}, 500);
}, 2000);
}
})();
QingJ © 2025
镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址