NPP 注册设置指南

概述

本文介绍如何为插件注册设置项

1. 获取 mainConts 容器

如果插件在 MetaData 中配置了 @setting true，那么 nitaiPage 会在页面再次加载时创建一个 data-value="ID" 的设置内容区域 (mainConts)：

<div class="mainConts pluginMainConts" data-value="你的插件NID"></div>

可用插件 NID 定位它：

// 将 YOUR_PLUGIN_NID 替换为实际插件 ID
const pluginId = 'YOUR_PLUGIN_NID';
const mainConts = document.querySelector(`.mainConts.pluginMainConts[data-value="${pluginId}"]`);

2. 往容器中添加内容

获取mainConts容器后，可以通过 DOM 操作添加自定义设置内容：

// 将 YOUR_PLUGIN_NID 替换为实际插件ID
const pluginId = 'YOUR_PLUGIN_NID';

function generateYourPluginSettings() {
    const mainConts = document.querySelector(`.mainConts.pluginMainConts[data-value="${pluginId}"]`);
    if (!mainConts) return;

    const card = document.createElement('div');
    card.className = 'set_tip set_tip_new';
    card.innerHTML = `
        <div class="switch-item tip_new_both">
            <div>
                <span class="set_text"><big>@yourPluginTextPart:a-part-of-the-plugin-text1 &nbsp;</big><br></span>
                <span class="set_text set_text_desc"><small>@yourPluginTextPart:a-part-of-the-plugin-text2</small></span>
            </div>
            <div class="switch" id="your_switch"></div>
        </div>
    `;

    mainConts.appendChild(card);
}

3. 注入时机

通过接收通知的方式来插入内容到对应的插件设置

document.addEventListener('pluginSettingsTemplateReady', function () {
    generateYourPluginSettings();
});

注意事项

1. 容器可能还没被创建：拿到的元素是 null 时直接返回，下一次事件再试
2. 遵循样式规范：遵循样式规范：尽量使用已有的通用组件，避免重新定义样式，保证样式的一致性
3. 国际化：文字部分写成 @你的插件前缀:词条名，再用 window.i18n.addTranslationEntries() 注入译文（创建翻译插件详见国际化）
4. 数据持久化优先用 NPP API 的 npp.set / npp.get / npp.remove —— 数据永久保存，卸载插件也不会丢失【将来用户可以一键清理已卸载插件的残留数据】localStorage 也可以用，但不建议（卸载后残留、用户无法清理）；Cookie 不要用（浏览器扩展环境下不可用，见NPP API）