专注模式 — 隐藏导航
一个按钮切换隐藏页眉、侧边栏和页脚以专注内容。
可复制的代码
var hidden = false;
var sels = 'header, nav, aside, footer, [role="banner"], [role="navigation"]';
var btn = document.createElement('button');
btn.textContent = 'Focus';
btn.style.cssText = 'position:fixed;bottom:20px;left:20px;z-index:99999;padding:8px 14px;border:none;border-radius:4px;background:#006870;color:#fff;cursor:pointer';
btn.onclick = function () {
hidden = !hidden;
document.querySelectorAll(sels).forEach(function (el) {
el.style.display = hidden ? 'none' : '';
});
btn.textContent = hidden ? 'Show' : 'Focus';
};
document.body.appendChild(btn);如何使用此示例
- 用上方按钮复制代码。
- 安装 JustZix（2 分钟），在目标页面打开扩展。
- 添加一条匹配该页面的新规则。
- 将代码粘贴到规则的 JavaScript 面板并保存 — 每次访问页面时都会运行。
为此示例评分
暂无评分 — 成为第一个。