油猴脚本 chrome 浏览器 插件 显示鼠标选中的文字总数（简略介绍）

前提：

　　安装有chrome

 效果：

 

安装插件：

 

// ==UserScript==
// @name         选中文本字数统计
// @namespace    http://tampermonkey.net/
// @version      1.5
// @description  鼠标选择一段文本，在右下角显示统计的字数
// @author       You
// @match        *://*/*
// @grant        none
// @run-at       document-end
// ==/UserScript==

(function() {
    'use strict';

    // 等待 DOM 完全加载
    function init() {
        // 检查 body 是否存在
        if (!document.body) {
            return;
        }

        // 检查是否已经存在
        if (document.getElementById('word-count-box')) {
            return;
        }

        // 创建样式
        const style = document.createElement('style');
        style.id = 'word-count-style';
        style.textContent = `
            #word-count-box {
                position: fixed;
                bottom: 20px;
                right: 20px;
                background-color: rgba(0, 0, 0, 0.85);
                color: #fff;
                padding: 12px 16px;
                border-radius: 6px;
                font-size: 14px;
                font-family: Arial, sans-serif;
                z-index: 2147483647;
                display: none;
                box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
                min-width: 150px;
                line-height: 1.6;
                pointer-events: none;
                user-select: none;
            }
        `;
        document.head.appendChild(style);

        // 创建显示框
        const wordCountBox = document.createElement('div');
        wordCountBox.id = 'word-count-box';
        wordCountBox.setAttribute('role', 'status');
        document.body.appendChild(wordCountBox);

        // 统计字数的函数
        function countWords(text) {
            if (!text || text.trim() === '') {
                return { total: 0, chinese: 0, english: 0, numbers: 0, other: 0 };
            }
            text = text.trim();

            const chineseChars = (text.match(/[\u4e00-\u9fa5]/g) || []).length;
            const englishChars = (text.match(/[a-zA-Z]/g) || []).length;
            const numberChars = (text.match(/\d/g) || []).length;
            const otherChars = (text.match(/[^\u4e00-\u9fa5a-zA-Z0-9\s]/g) || []).length;

            const total = chineseChars + englishChars + numberChars + otherChars;
            return {
                total: total,
                chinese: chineseChars,
                english: englishChars,
                numbers: numberChars,
                other: otherChars
            };
        }

        // 显示字数统计
        function showWordCount() {
            const selection = window.getSelection();
            const selectedText = selection.toString().trim();

            if (selectedText.length > 0) {
                const count = countWords(selectedText);
                wordCountBox.innerHTML = `
                    <div style="font-weight:bold;margin-bottom:6px;border-bottom:1px solid #555;padding-bottom:4px;">📊 字数统计</div>
                    <div>📝 总字符：${count.total}</div>
                    <div>🇨🇳 中文：${count.chinese}</div>
                    <div>🔤 英文：${count.english}</div>
                    <div>🔢 数字：${count.numbers}</div>
                    <div>📌 其他：${count.other}</div>
                `;
                wordCountBox.style.display = 'block';

                // 调整位置
                try {
                    const selectionRange = selection.getRangeAt(0);
                    const rect = selectionRange.getBoundingClientRect();

                    if (rect.right > window.innerWidth - 200) {
                        wordCountBox.style.right = (window.innerWidth - rect.left + 10) + 'px';
                    } else {
                        wordCountBox.style.right = '20px';
                    }

                    if (rect.bottom > window.innerHeight - 150) {
                        wordCountBox.style.bottom = (window.innerHeight - rect.top + 10) + 'px';
                    } else {
                        wordCountBox.style.bottom = '20px';
                    }
                } catch (e) {
                    wordCountBox.style.right = '20px';
                    wordCountBox.style.bottom = '20px';
                }
            } else {
                hideWordCount();
            }
        }

        // 隐藏字数统计
        function hideWordCount() {
            wordCountBox.style.display = 'none';
        }

        // 监听鼠标松开事件
        document.addEventListener('mouseup', function() {
            setTimeout(function() {
                const selection = window.getSelection();
                const selectedText = selection.toString().trim();
                if (selectedText.length > 0) {
                    showWordCount();
                } else {
                    hideWordCount();
                }
            }, 100);
        });

        // 键盘选择文本时更新统计
        document.addEventListener('keyup', function(e) {
            if (e.shiftKey || e.key === 'ArrowLeft' || e.key === 'ArrowRight' || e.key === 'ArrowUp' || e.key === 'ArrowDown') {
                setTimeout(function() {
                    const selection = window.getSelection();
                    const selectedText = selection.toString().trim();
                    if (selectedText.length > 0) {
                        showWordCount();
                    } else {
                        hideWordCount();
                    }
                }, 100);
            }
        });

        // 滚动和窗口大小改变时隐藏统计框
        document.addEventListener('scroll', function() {
            hideWordCount();
        });

        window.addEventListener('resize', function() {
            hideWordCount();
        });
    }

    // 根据当前状态决定如何执行
    if (document.readyState === 'complete' || document.readyState === 'interactive') {
        init();
    } else {
        document.addEventListener('DOMContentLoaded', init);
    }

    // 备用方案：如果 3 秒后还没初始化，强制执行
    setTimeout(function() {
        if (!document.getElementById('word-count-box')) {
            init();
        }
    }, 3000);
})();