Greasy Fork is available in English.

点击变色

点击变色并在新窗口打开 alt+ctrl+c 打开颜色设置面板

Per 15-02-2017. Zie de nieuwste versie.

// ==UserScript==
// @name         点击变色
// @version      0.46
// @description  点击变色并在新窗口打开 alt+ctrl+c 打开颜色设置面板
// @match        *://*/*
// @author       变异小僵尸
// @namespace https://greasyfork.org/users/85375
// ==/UserScript==
(function() {
    'use strict';
    //变量
    var color = "#bbb";
    var storage = window.localStorage;
    var isHttp = 'https:' == document.location.protocol ? true : false;
    var styles = '';
    // 设置storage
    if (storage.getItem('colorDown')) {
        color = storage.getItem('colorDown');
    } else {
        storage.setItem('colorDown', color);
    }
    // 设置界面
    var colorHtml = '[点击变色]颜色设置(当前域名)<div>' +
        '<input class="jscolor {hash:true,uppercase:false}" type="text" id="colorDownInput" style="width: 80px;" value=' + color + '>' +
        '<button id="colorDownOk">确定</button>' +
        '<button id="colorDownHide">隐藏</button></div>';
    // 设置按键
    window.onkeydown = function(event) {
        var e = event || window.event || arguments.callee.caller.arguments[0];
        if (e.keyCode == 67 && e.ctrlKey && e.altKey) {
            if (!document.querySelector('#colorControl')) {
                var div = document.createElement('div');
                div.setAttribute('id', 'colorControl');
                div.setAttribute('style', 'position: fixed;top: 15px;right: 15px;background-color: white;height: auto;line-height: 30px;z-index:99999');
                div.innerHTML = colorHtml;
                document.body.appendChild(div);
            } else {
                document.querySelector('#colorControl').style.display = 'block';
            }
            if (!document.querySelector('#colorJscolor')) {
                var script = document.createElement("script");
                if (isHttp) {
                    script.setAttribute('src', 'https://cdn.bootcss.com/jscolor/2.0.4/jscolor.min.js');
                } else {
                    script.setAttribute('src', 'http://cdn.bootcss.com/jscolor/2.0.4/jscolor.min.js');
                }
                script.setAttribute('id', 'colorJscolor');
                var heads = document.querySelectorAll("head");
                if (heads.length) {
                    heads[0].appendChild(script);
                } else {
                    document.documentElement.appendChild(script);
                }
            }
            //获取设置
            document.querySelector('#colorDownOk').addEventListener('click', function() {
                setColor();
            }, false);
            document.querySelector('#colorDownHide').addEventListener('click', function() {
                // document.body.removeChild(document.querySelector('#colorControl'));
                document.querySelector('#colorControl').style.display = 'none';
                // document.head.removeChild(document.querySelector('#colorJscolor'));
            }, false);
        }
    };
    // 设置颜色
    var style = 'a:visited{color:' + color + ' !important}';
    addStyle(style);
    //获取所有a标签
    var a = document.querySelectorAll('a');

    for (var i = 0; i < a.length; i++) {
        // console.log(a[i].childNodes);
        // childNodes(a[i], 1);
        a[i].addEventListener('mousedown', function(e) {
            // e.preventDefault()
            var that = this;
            that.addEventListener('click', function(e) {
                var href = that.getAttribute('href').toLowerCase();
                // 判定a标签链接
                if (href === "" || href == "#" || href == "javascript:;" || href == "javascript:void(0);" || href == "javascript" || href == "javascript:void(0)") {
                    window.location.href = that.getAttribute('href');
                } else {
                    // 阻止默认点击
                    e.preventDefault();
                    // 再新窗口打开链接
                    window.open(that.getAttribute('href'));
                }
            }, false);
            styles = that.getAttribute('style');
            if (styles !== null) {
                styles = styles.toLowerCase();
                if (styles.indexOf('color:' + color) === -1) {
                    styles += ';color:' + color + ';';
                }
            } else {
                styles = 'color:' + color + ';';
            }
            //添加
            that.setAttribute('style', styles);
        }, false);
    }
    //创建style
    function addStyle(string) {
        var style = document.createElement("style");
        style.setAttribute("type", "text/css");
        style.setAttribute("id", 'colorDownStyle');
        if (style.styleSheet) { // IE
            style.styleSheet.cssText = string;
        } else { // w3c
            var cssText = document.createTextNode(string);
            style.appendChild(cssText);
        }
        var heads = document.querySelectorAll("head");
        if (heads.length) {
            heads[0].appendChild(style);
        } else {
            document.documentElement.appendChild(style);
        }
    }
    // 获取颜色
    function setColor() {
        var i = document.querySelector('#colorDownInput').value;
        if (/^#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})$/.test(i)) {
            storage.setItem('colorDown', i);
            color = i;
            var style = 'a:visited{color:' + color + ' !important}';
            if (document.querySelector('#colorDownStyle')) {
                document.head.removeChild(document.querySelector('#colorDownStyle'));
            }
            addStyle(style);
        } else {
            alert('请输入正确的颜色，如：#ffffff');
        }
    }
    // 获取所有元素 type 1元素 2节点属性 3文本 8注释 9document 11 document片段
    function childNodes(id, type) {
        var node = [];
        function foo(id2){
          for (var i = 0; i < id2.childNodes.length; i++) {
            if (id2.childNodes[i].nodeType === type) {
              if (type === 1) {
                //递归
                node.push(id2.childNodes[i]);
                foo(id2.childNodes[i], type);
              }
            }
          }
        }
        foo(id);
        return node;
    }
})();