偶尔会遇到长楼(例子插件化动画/漫画/小说/影视/音乐/网盘聚合软件汇总列表 - #2,来自 oldsento 之前还习以为常,但突然想着这不很奇怪? ?本站居然没有长楼折叠,看看其他网站,貌似大部分都自带了,而且还各种限制,于是又得找自动展开脚本了
……
总之有的话分享一下,3Q very much!
找到一个镜像https://home.greasyfork.org.cn/zh-hans 搜了下,没有相关脚本,没办法去问一下那些免费xxAI吧
偶尔会遇到长楼(例子插件化动画/漫画/小说/影视/音乐/网盘聚合软件汇总列表 - #2,来自 oldsento 之前还习以为常,但突然想着这不很奇怪? ?本站居然没有长楼折叠,看看其他网站,貌似大部分都自带了,而且还各种限制,于是又得找自动展开脚本了
……
总之有的话分享一下,3Q very much!
找到一个镜像https://home.greasyfork.org.cn/zh-hans 搜了下,没有相关脚本,没办法去问一下那些免费xxAI吧
问AI搞了个脚本,但不知哪里有问题,X浏览器,via和Alook测试,没用诶,有没有人指导一下,不懂代码:
// ==UserScript==
// @name Long Post Collapse
// @namespace http://tampermonkey.net/
// @version 0.3
// @description Collapse long posts in niche forums, with support for Android browsers including X, Via, and Alook
// @author Your Name
// @match https://meta.appinn.net/t/topic/*
// @grant none
// ==/UserScript==
(function() {
'use strict';
// 创建折叠按钮
const createCollapseButton = (post) => {
const button = document.createElement('button');
button.innerText = '折叠';
button.style.marginBottom = '10px';
button.style.cursor = 'pointer'; // 增加鼠标指针样式
button.style.backgroundColor = '#007bff'; // 按钮背景色
button.style.color = '#fff'; // 按钮文字颜色
button.style.border = 'none'; // 去掉边框
button.style.padding = '5px 10px'; // 增加内边距
button.style.borderRadius = '5px'; // 圆角
button.onclick = () => {
const content = post.querySelector('.post-content');
if (content.style.display === 'none') {
content.style.display = 'block';
button.innerText = '折叠';
} else {
content.style.display = 'none';
button.innerText = '展开';
}
};
return button;
};
// 查找所有长楼层
const posts = document.querySelectorAll('.post');
posts.forEach(post => {
const content = post.querySelector('.post-content');
if (content && content.innerText.length > 500) { // 假设500字以上为长楼层
const button = createCollapseButton(post);
post.insertBefore(button, content);
content.style.display = 'block'; // 默认显示
}
});
// 兼容安卓浏览器的事件处理
document.addEventListener('touchstart', function(event) {
if (event.target.tagName === 'BUTTON') {
event.preventDefault(); // 防止默认行为
}
}, { passive: false });
// 适配 X 浏览器、Via 浏览器和 Alook 浏览器
const isAndroidBrowser = () => {
const userAgent = navigator.userAgent.toLowerCase();
return userAgent.includes('android') && (userAgent.includes('xbrowser') || userAgent.includes('via') || userAgent.includes('alook'));
};
if (isAndroidBrowser()) {
// 针对特定浏览器的额外适配
console.log('适配 X 浏览器、Via 浏览器和 Alook 浏览器');
// 这里可以添加特定的适配代码
}
})();
你可以试试贴子右侧的时间轴线.
虽然不能折叠,但是可以快速定位
应该是楼这个概念不好定义,可能你需要多找几种有楼的网站,让AI分析共性再去开发
因为只是偶尔用的便宜免费AI,所以搞开发能力还是很多限制啊难搞,如果有心人帮忙就好了
sonnet 4.5是这么说的
优化后的脚本
1 + // ==UserScript==
2 + // @name Long Post Collapse
3 + // @namespace http://tampermonkey.net/
4 + // @version 0.4
5 + // @description Collapse long posts in niche forums, with support for Android
+ browsers including X, Via, and Alook
6 + // @author Your Name
7 + // @match https://meta.appinn.net/t/topic/*
8 + // @grant none
9 + // ==/UserScript==
10 +
11 + (function() {
12 + 'use strict';
13 +
14 + const CONFIG = {
15 + minLength: 500, // 最小字数阈值
16 + buttonCollapsed: '展开',
17 + buttonExpanded: '折叠'
18 + };
19 +
20 + // 创建折叠按钮
21 + const createCollapseButton = (post) => {
22 + const button = document.createElement('button');
23 + button.className = 'post-collapse-btn';
24 + button.innerText = CONFIG.buttonExpanded;
25 + button.style.cssText = `
26 + margin-bottom: 10px;
27 + cursor: pointer;
28 + background-color: #007bff;
29 + color: #fff;
30 + border: none;
31 + padding: 5px 10px;
32 + border-radius: 5px;
33 + font-size: 14px;
34 + transition: background-color 0.2s;
35 + `;
36 +
37 + button.onmouseenter = () => button.style.backgroundColor = '#0056b3';
38 + button.onmouseleave = () => button.style.backgroundColor = '#007bff';
39 +
40 + button.onclick = (e) => {
41 + e.preventDefault();
42 + const content = post.querySelector('.post-content');
43 + if (content.style.display === 'none') {
44 + content.style.display = 'block';
45 + button.innerText = CONFIG.buttonExpanded;
46 + } else {
47 + content.style.display = 'none';
48 + button.innerText = CONFIG.buttonCollapsed;
49 + }
50 + };
51 +
52 + return button;
53 + };
54 +
55 + // 处理单个帖子
56 + const processPost = (post) => {
57 + // 防止重复处理
58 + if (post.dataset.collapseProcessed) return;
59 +
60 + const content = post.querySelector('.post-content');
61 + if (content && content.innerText.trim().length > CONFIG.minLength) {
62 + // 检查是否已有按钮
63 + if (!post.querySelector('.post-collapse-btn')) {
64 + const button = createCollapseButton(post);
65 + post.insertBefore(button, content);
66 + }
67 + post.dataset.collapseProcessed = 'true';
68 + }
69 + };
70 +
71 + // 处理所有帖子
72 + const processAllPosts = () => {
73 + document.querySelectorAll('.post').forEach(processPost);
74 + };
75 +
76 + // 初始处理
77 + processAllPosts();
78 +
79 + // 监听动态加载的内容
80 + const observer = new MutationObserver((mutations) => {
81 + let shouldProcess = false;
82 + mutations.forEach(mutation => {
83 + mutation.addedNodes.forEach(node => {
84 + if (node.nodeType === 1) {
85 + if (node.classList?.contains('post') ||
+ node.querySelector?.('.post')) {
86 + shouldProcess = true;
87 + }
88 + }
89 + });
90 + });
91 + if (shouldProcess) {
92 + processAllPosts();
93 + }
94 + });
95 +
96 + observer.observe(document.body, {
97 + childList: true,
98 + subtree: true
99 + });
100 + })();
呃前面的行号能去掉么?手机浏览器复制会带走啊
经测试,alook,X,via没用诶
长楼折叠是什么效果
示例:
隔壁chii.in / bgm.tv 还是用的基于该网站开发的折叠组件,该网站自带了开发环境,这方面窝不太懂具体是啥
你是需要一个手动添加截断的功能么?
为啥是手动?如果可以设置成自动/默认那也可以
用了Opus 4.5,我电脑上测试可以了
// ==UserScript==
// @name Discourse 帖子折叠
// @namespace http://tampermonkey.net/
// @version 1.0
// @description 折叠超过6em高度的帖子回复,点击展开/收起
// @author Jerry
// @match *://meta.appinn.net/*
// @match *://*.discourse.org/*
// @grant GM_addStyle
// ==/UserScript==
(function() {
'use strict';
const MAX_HEIGHT = '6em';
GM_addStyle(`
.post-collapsed {
max-height: ${MAX_HEIGHT};
overflow: hidden;
position: relative;
}
.post-collapsed::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 3em;
background: linear-gradient(transparent, var(--secondary, #fff));
pointer-events: none;
}
.post-expand-btn {
display: block;
width: 100%;
padding: 8px;
margin-top: 4px;
background: var(--tertiary-low, #e9e9e9);
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 14px;
color: var(--primary, #333);
text-align: center;
}
.post-expand-btn:hover {
background: var(--tertiary, #ddd);
}
.post-expand-btn:active {
transform: scale(0.98);
}
@media (max-width: 768px) {
.post-expand-btn {
padding: 12px;
font-size: 16px;
}
}
`);
function processPost(article) {
if (article.dataset.collapsed !== undefined) return;
const content = article.querySelector('.cooked');
if (!content) return;
// 标记已处理
article.dataset.collapsed = 'false';
// 检测实际高度
const checkHeight = () => {
const emInPx = parseFloat(getComputedStyle(content).fontSize);
const maxPx = emInPx * 6;
if (content.scrollHeight > maxPx + 10) {
if (!content.classList.contains('post-collapsed')) {
content.classList.add('post-collapsed');
article.dataset.collapsed = 'true';
// 添加展开按钮
let btn = article.querySelector('.post-expand-btn');
if (!btn) {
btn = document.createElement('button');
btn.className = 'post-expand-btn';
btn.textContent = '展开全部';
btn.onclick = () => {
const isCollapsed = content.classList.toggle('post-collapsed');
btn.textContent = isCollapsed ? '展开全部' : '收起';
article.dataset.collapsed = isCollapsed ? 'true' : 'false';
};
content.parentNode.insertBefore(btn, content.nextSibling);
}
}
}
};
// 等待图片加载后再检测
const images = content.querySelectorAll('img');
if (images.length > 0) {
let loaded = 0;
images.forEach(img => {
if (img.complete) {
loaded++;
} else {
img.onload = img.onerror = () => {
loaded++;
if (loaded === images.length) checkHeight();
};
}
});
if (loaded === images.length) checkHeight();
} else {
checkHeight();
}
}
function processAllPosts() {
document.querySelectorAll('article.boxed, .topic-post').forEach(processPost);
}
// 初始处理
processAllPosts();
// 监听动态加载的帖子
const observer = new MutationObserver((mutations) => {
mutations.forEach(mutation => {
mutation.addedNodes.forEach(node => {
if (node.nodeType === 1) {
if (node.matches('article.boxed, .topic-post')) {
processPost(node);
}
node.querySelectorAll?.('article.boxed, .topic-post').forEach(processPost);
}
});
});
});
observer.observe(document.body, { childList: true, subtree: true });
})();
经过测试,安卓x浏览器4.8.2,via5.9.0正常,alook10.9没用,
话说折叠太狠了吧
,4行字符都要折叠诶,可以自定义行数和字符总数么?具体改哪里?
发现bug,脚本执行很慢,x浏览器上很多时候都没反应或要等一段时间
就是开头这个地方,6em=4行高,你自己换算下
安卓浏览器对脚本支持还是太弱,印象中via好像已经停止开发了吧?
https://m.wandoujia.com/apps/6609177
我有个问题啊,目前对于长文,并不会一次性全部加载,本身也是只显示几层楼啊
有时候想刷楼看评论,但是可能某个楼层特别长,比如软件更新了,写了一串介绍,电脑上其实还好,手机确实就挺烦的