将百度贴吧某帖子中楼主的所有发言保存为 HTML 文件，方便离线浏览
// ==UserScript==
// @name 导出百度贴吧楼主帖子
// @namespace http://tampermonkey.net/
// @version 1.1.1
// @description 将百度贴吧某帖子中楼主的所有发言保存为 HTML 文件，方便离线浏览
// @author wiiiind
// @match https://tieba.baidu.com/p/*
// @grant GM_download
// @license MIT
// ==/UserScript==
(function() {
'use strict';
// 添加按钮到页面
function addButton() {
const button = document.createElement('a');
button.innerText = '保存楼主发言';
button.href = 'javascript:;';
button.className = 'btn-sub btn-small';
button.onclick = saveTiebaPosts;
// 找到按钮组区域
const btnGroup = document.querySelector('.core_title_btns');
if (btnGroup) {
// 插入到按钮组的第一个位置
btnGroup.insertBefore(button, btnGroup.firstChild);
}
}
let currentPage = 1;
let totalPages = 1;
let posts = [];
function fetchPosts(page) {
const url = window.location.href.replace(/&pn=\d+/, '') + '&pn=' + page;
return fetch(url)
.then(response => response.text())
.then(html => {
const parser = new DOMParser();
const doc = parser.parseFromString(html, 'text/html');
const postElements = doc.querySelectorAll('.l_post');
postElements.forEach(post => {
try {
// 获取IP属地
const ipSpan = post.querySelector('.post-tail-wrap span:not([class])');
const ip = ipSpan ? ipSpan.innerText.trim().replace(/^IP属地:/, '') : '未知IP';
// 获取其他信息
const tailInfoSpans = post.querySelectorAll('.post-tail-wrap .tail-info');
let deviceInfo = '未知设备';
let floor = '未知楼层';
let time = '未知时间';
// 遍历所有tail-info span，找到包含设备信息、楼层和时间的span
tailInfoSpans.forEach(span => {
const text = span.innerText.trim();
if (span.querySelector('a') && text.includes('来自')) {
deviceInfo = span.querySelector('a').innerText.trim();
} else if (text.includes('楼')) {
floor = text;
} else if (text.match(/\d{4}-\d{2}-\d{2}/)) {
time = text;
}
});
// 获取内容
const contentElement = post.querySelector('.d_post_content');
const content = contentElement ? contentElement.innerHTML.trim() : '';
// 修改图片获取逻辑，只获取BDE_Image类的图片
const images = Array.from(post.querySelectorAll('.d_post_content img.BDE_Image')).map(img => img.src || '');
posts.push({
ip,
deviceInfo,
floor,
time,
content,
images
});
} catch (error) {
console.error('处理帖子时出错:', error);
}
});
return Promise.resolve();
})
.catch(error => {
console.error(`获取第${page}页数据时出错:`, error);
});
}
function savePosts() {
const title = document.querySelector('.core_title_txt').innerText.trim();
const date = new Date().toLocaleString('zh-CN', {
year: 'numeric',
month: '2-digit',
day: '2-digit',
hour: '2-digit',
minute: '2-digit',
second: '2-digit',
hour12: false
});
const fileName = `${title}_${date.split(' ')[0]}.html`;
// 获取楼主信息
const authorElement = document.querySelector('.d_name .p_author_name');
const authorName = authorElement ? authorElement.innerText : '未知用户';
const authorLink = authorElement ? authorElement.href : '#';
const authorAvatar = document.querySelector('.p_author_face img');
const avatarSrc = authorAvatar ? authorAvatar.src : '';
const originalLink = window.location.href;
// 在生成HTML前对posts进行排序
posts.sort((a, b) => {
// 从楼层文本中提取数字
const getFloorNumber = (floor) => {
const match = floor.match(/(\d+)/);
return match ? parseInt(match[1], 10) : 0;
};
return getFloorNumber(a.floor) - getFloorNumber(b.floor);
});
let htmlContent = `
<html>
<head>
<meta charset="UTF-8">
<title>${title}</title>
<script>
// 免责声明弹窗
window.onload = function() {
const disclaimer = \`1. 本帖子保存时间：${date}
2. 本脚本旨在为用户提供便利，用于个人备份公开访问的内容。请确保您在使用本脚本时遵守相关平台的用户协议及法律法规。
3. 本脚本仅限个人学习、研究或备份用途，禁止用于任何非法行为，包括但不限于：未经授权抓取、复制、传播受版权保护的内容或侵犯他人合法权益。
4. 使用本脚本可能涉及到技术风险，例如账号被限制或封禁等情况。请在使用前充分了解风险，并自行承担因使用脚本所引发的后果。
5. 本脚本的作者不对因脚本使用导致的任何直接或间接后果承担责任，包括但不限于数据丢失、账号封禁或其他法律责任。
6. 作者保留修改、更新或终止维护脚本的权利。\`;
window.alert = function(msg) {
const iframe = document.createElement('iframe');
iframe.style.display = 'none';
document.body.appendChild(iframe);
const alertFrame = iframe.contentWindow;
const result = alertFrame.alert(msg);
iframe.parentNode.removeChild(iframe);
return result;
};
alert(disclaimer);
}
// 跳转楼层的函数
function jumpToFloor() {
const targetFloor = parseInt(prompt('请输入要跳转的楼层号：'));
if (!targetFloor) return;
// 获取所有楼层
const floors = Array.from(document.querySelectorAll('table[data-floor]'))
.map(table => ({
element: table,
floor: parseInt(table.getAttribute('data-floor'))
}))
.sort((a, b) => a.floor - b.floor);
// 找到目标楼层或最近的前一个楼层
let targetElement = null;
for (let i = floors.length - 1; i >= 0; i--) {
if (floors[i].floor <= targetFloor) {
targetElement = floors[i].element;
break;
}
}
if (targetElement) {
targetElement.scrollIntoView({ behavior: 'smooth' });
// 如果不是精确匹配，显示提示
if (parseInt(targetElement.getAttribute('data-floor')) < targetFloor) {
alert('未找到该楼层，已定位到最近的前一个楼层：' +
targetElement.getAttribute('data-floor') + '楼');
}
} else {
// 如果连第一层都大于目标楼层，就跳转到第一层
if (floors.length > 0) {
floors[0].element.scrollIntoView({ behavior: 'smooth' });
alert('未找到该楼层，已定位到第一个楼层：' +
floors[0].floor + '楼');
}
}
}
</script>
<style>
body {
margin: 20px;
font-family: Arial, sans-serif;
max-width: 794px; /* A4 width */
margin-left: auto;
margin-right: auto;
}
.header {
position: sticky;
top: 0;
background: white;
width: 100%;
z-index: 100;
padding: 10px 0;
display: flex;
flex-direction: column;
align-items: center;
border-bottom: 1px solid #eee;
}
.title {
font-size: 24px;
font-weight: bold;
margin: 10px 0;
text-align: center;
}
.content-wrapper {
margin-top: 20px;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.author-info {
display: flex;
align-items: center;
margin-bottom: 20px;
gap: 10px;
}
.author-avatar {
width: 48px;
height: 48px;
border-radius: 50%;
}
.links {
margin-bottom: 20px;
text-align: center;
}
.links a {
color: #4CAF50;
text-decoration: none;
margin: 0 10px;
}
.links a:hover {
text-decoration: underline;
}
table {
border-collapse: collapse;
width: 100%; /* Use full width of body */
margin-bottom: 20px;
position: relative;
}
tr {
display: flex;
}
td {
padding: 10px;
vertical-align: top;
}
.info-cell {
width: 22%;
border-right: 1px solid #ddd;
}
.content-cell {
width: 78%;
flex: 1;
}
.floor-number {
font-size: 18px;
font-weight: bold;
margin-bottom: 10px;
}
.info-item {
margin: 5px 0;
color: #666;
}
img {
max-width: 100%;
margin: 5px 0;
}
.jump-btn {
position: fixed;
bottom: 20px;
right: 20px;
background: #4CAF50;
color: white;
border: none;
padding: 10px 20px;
border-radius: 5px;
cursor: pointer;
z-index: 1000;
}
.jump-btn:hover {
background: #45a049;
}
/* 让表格有一个data-floor属性用于跳转 */
table {
scroll-margin-top: 100px; /* 跳转时留出顶部空间 */
}
/* 添加免责声明的样式 */
.disclaimer {
white-space: pre-wrap;
font-family: monospace;
}
.footer {
text-align: center;
padding: 20px;
color: #666;
font-size: 14px;
margin-top: 40px;
border-top: 1px solid #eee;
}
.footer a {
color: #4CAF50;
text-decoration: none;
}
.footer a:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<button class="jump-btn" onclick="jumpToFloor()">跳转到指定楼层</button>
<div class="header">
<div class="title">${title}</div>
</div>
<div class="content-wrapper">
<div class="author-info">
<img class="author-avatar" src="${avatarSrc}" alt="${authorName}">
<a href="${authorLink}" target="_blank">${authorName}</a>
</div>
<div class="links">
<a href="${originalLink}" target="_blank">查看原帖</a>
<a href="${authorLink}" target="_blank">作者主页</a>
</div>
<!-- 帖子内容将在这里显示 -->
`;
posts.forEach(post => {
// 从content中移除所有BDE_Image图片
const tempDiv = document.createElement('div');
tempDiv.innerHTML = post.content;
tempDiv.querySelectorAll('img.BDE_Image').forEach(img => img.remove());
const contentWithoutImages = tempDiv.innerHTML;
htmlContent += `
<table data-floor="${post.floor.match(/(\d+)/)?.[1] || '0'}">
<tr>
<td class="info-cell">
<div class="floor-number">${post.floor}</div>
<div class="info-item">IP属地: ${post.ip}</div>
<div class="info-item">设备: ${post.deviceInfo}</div>
<div class="info-item">时间: ${post.time}</div>
</td>
<td class="content-cell">
<div>${contentWithoutImages}</div>
<div>${post.images.map(src => `<img src="${src}" class="BDE_Image">`).join('')}</div>
</td>
</tr>
</table>
`;
});
// 获取当前登录用户信息
const userElement = document.querySelector('.u_menu_username a');
const userName = userElement ? userElement.querySelector('.u_username_title').textContent : '未登录用户';
const userLink = userElement ? userElement.href : '#';
htmlContent += `
<div class="footer">
帖子由<a href="${userLink}" target="_blank">@${userName}</a>通过<a href="https://greasyfork.org/zh-CN/scripts/518200-tieba-op-posts-saver" target="_blank">此脚本</a>自动抓取生成。
欲查看于移动设备，请<a href="javascript:void(0)" onclick="printToPDF()">另存为PDF</a>。
</div>
<script>
function printToPDF() {
if (confirm('请选择"另存为PDF"打印机进行打印')) {
window.print();
}
}
</script>
</body>
</html>
`;
// 添加打印样式
const printStyles = `
@media print {
.jump-btn {
display: none; /* 隐藏跳转按钮 */
}
/* 确保内容完整打印 */
.content-cell img {
break-inside: avoid;
}
/* 优化打印布局 */
table {
break-inside: avoid;
page-break-inside: avoid;
}
}
`;
// 将打印样式插入到现有样式中
htmlContent = htmlContent.replace('</style>', printStyles + '</style>');
const blob = new Blob([htmlContent], { type: 'text/html' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = fileName;
a.click();
URL.revokeObjectURL(url);
}
function saveTiebaPosts() {
console.log('开始保存楼主发言...');
// 检查是否在只看楼主模式
if (!window.location.href.includes('see_lz=1')) {
alert('此功能需要在"只看楼主"模式下使用。\n\n请先点击帖子上方的"只看楼主"按钮，然后再次点击"保存楼主发言"。');
// 找到"只看楼主"按钮并高亮显示
const lzOnlyBtn = document.querySelector('#lzonly_cntn');
if (lzOnlyBtn) {
// 保存原始样式
const originalBackground = lzOnlyBtn.style.background;
const originalTransition = lzOnlyBtn.style.transition;
// 添加闪烁效果
lzOnlyBtn.style.transition = 'background 0.5s';
lzOnlyBtn.style.background = '#ffd700';
// 1秒后恢复原样
setTimeout(() => {
lzOnlyBtn.style.background = originalBackground;
lzOnlyBtn.style.transition = originalTransition;
}, 1000);
}
return;
}
// 清空之前的帖子数据
posts = [];
currentPage = 1;
// 获取总页数
const lastPageLink = document.querySelector('.l_pager a[href*="pn="]:last-child');
if (lastPageLink) {
const match = lastPageLink.href.match(/pn=(\d+)/);
if (match) {
totalPages = parseInt(match[1], 10);
}
}
console.log(`总页数: ${totalPages}`);
// 创建一个加载提示
const loadingDiv = document.createElement('div');
loadingDiv.style.position = 'fixed';
loadingDiv.style.top = '50%';
loadingDiv.style.left = '50%';
loadingDiv.style.transform = 'translate(-50%, -50%)';
loadingDiv.style.padding = '20px';
loadingDiv.style.background = 'rgba(0,0,0,0.8)';
loadingDiv.style.color = 'white';
loadingDiv.style.borderRadius = '5px';
loadingDiv.style.zIndex = '10000';
document.body.appendChild(loadingDiv);
// 使Promise.all和分批处理来获取所有页面
const batchSize = 5; // 每批处理5个页面
const batches = [];
for (let i = 1; i <= totalPages; i += batchSize) {
const batch = [];
for (let j = i; j < Math.min(i + batchSize, totalPages + 1); j++) {
batch.push(fetchPosts(j));
}
batches.push(batch);
}
// 按批次处理所有页面
let processedPages = 0;
const processBatch = async (batchIndex) => {
if (batchIndex >= batches.length) {
// 所有批次处理完成，保存文件
loadingDiv.remove();
savePosts();
return;
}
await Promise.all(batches[batchIndex]);
processedPages += batches[batchIndex].length;
loadingDiv.textContent = `正在获取帖子内容... ${Math.min(processedPages, totalPages)}/${totalPages}`;
// 延迟处理下一批次，避免请求过快
setTimeout(() => processBatch(batchIndex + 1), 1000);
};
loadingDiv.textContent = '正在获取帖子内容... 0/' + totalPages;
processBatch(0);
}
// 初始化
addButton();
})();