PagePilot allows custom keybindings and CSS selectors for page-turning buttons to be uniquely configured per URL. Automatically detects webpage addresses and applies your preset rules, enabling precise one-click navigation across all sites.
当前为
使用前需要根据需要定义更改脚本中的options和optionsVer值。
Before use, you need to define and modify the options and optionsVer values in the script as needed.
代码演示了如何通过灵活的数据结构为不同网站配置键盘导航选项。它定义了按键映射、导航选择器和配置项的类型，并提供了一个示例配置对象。 这种结构允许你为不同的网站定义自定义的键盘快捷键和导航逻辑，支持简单和多层嵌套的选择器。 This code demonstrates how to configure keyboard navigation options for different websites using a flexible data structure. It defines types for key mappings, pilot selectors, and options, and provides a sample configuration object． This structure allows you to define custom keyboard shortcuts and navigation logic for different websites, supporting both simple and deeply nested selectors.
/// 修改选项时请同步更新 `optionsVer` 的值
/// update `optionsVer` when you change options
const optionsVer = 1;
/// 自定义选项从这里开始，修改选项时请同步更新 `optionsVer` 的值
/// custom options start here, you should update `optionsVer` when you change options
options = {
globalKeys: {
// 绑定名称的通用按键，所有网站的元素根据名称自动绑定到这些按键上
// Common keys bound by name, elements on all sites will be automatically bound to these keys
prev: { code: ["ArrowUp", "PageUp", "KeyP", "KeyD"] },
next: { code: ["ArrowDown", "PageDown", "KeyN", "KeyF"] },
top: { code: ["Home", "KeyT"] },
bottom: { code: ["End", "KeyB"] },
},
pilots: {
// 站点正则 => 元素选择器或按键
// site regex => element selector or key
"http://example1.com(/.*)?": {
// 当点击元素对应的按键时候，触发元素的点击事件: PageUp => querySelector('.pg .prev_btn').click()
// When the corresponding key is pressed, trigger the element's click event: PageUp => querySelector('.pg .prev_btn').click()
prev: ".pg .prev_btn",
next: ".pg .next_btn",
},
// 通过当前页元素的兄弟来定位翻页按钮
// locate the page-turning buttons by the siblings of the current page element
"https://(.*\.)?example2.org(/.*)?": { cur: "#cur_page" },
// 通过当前页元素的兄弟的子孙来定位翻页按钮
// locate the page-turning buttons by the descendants of the siblings of the current page element
"https?://(.*\.)?example3.org(/.*)?": {
cur: "#cur_page",
prev: "a", // querySelector('#cur_page').prevElment.querySelector(a).click()
next: "a", // querySelector('#cur_page').nextElment.querySelector(a).click()
},
"https?://(.*\.)?example4.org(/.*)?": {
// 多层级子孙、兄弟的翻页按钮的定位规则： querySelector('.nav .pg').prevE.prevE.prevE.querySelector(a).click()
// multi-level descendants and siblings page button location rules (): querySelector('.nav .pg').prevE.prevE.prevE.querySelector(a).click()
prev: {
child: ".nav",
deep: {
child: ".pg",
sibling: -3,
deep: {
child: "a",
},
},
},
next: {
child: ".nav",
deep: {
child: ".pg",
sibling: 5, // querySelector('.nav .pg') .nextE x5 .querySelector(a).click()
deep: {
child: "a",
},
},
},
// 定义翻页以外的任意按钮
// define any buttons other than page turning
other: {
// 显示指定绑定或者禁用全局按键
// Explicitly bind or disable global keys
top: "#top",
bottom: {
// 显示指定绑定或者禁用全局按键
// Explicitly bind or disable global keys
globalKeys: false, // disable
child: "#bottomBtn",
// 指定只对该网站生效的按键
// Specify keys that only take effect on this site
keys: { code: ["KeyN"] },
},
close: {
child: "#closeBtn",
keys: { code: ["KeyC"] },
},
},
},
},
};
/// 自定义选项从这里结束
/// custom options end here
// Typescript 类型定义
// Typescript definitions
export type PilotKey = { key?: string[]; code?: string[] };
export type PilotType = "prev" | "next";
export type Pilot = {
cur?: string;
prev?: PilotSel;
next?: PilotSel;
other?: { [k in string]: PilotSel };
};
export type PilotSel = string | PilotSelKey;
export interface PilotDeep {
sibling?: number;
child?: string;
deep?: PilotDeep;
}
export interface PilotSelKey extends PilotDeep {
globalKeys?: string | boolean;
keys?: PilotKey;
}
export type PilotOptions = {
globalKeys: { [k in string]: PilotKey };
pilots: {
[url in string]: Pilot;
};
};
QingJ © 2025
镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址