Greasy Fork

Greasy Fork is available in English.

复制为Markdown格式

复制网页内容为Markdown格式。点击右上角copy按钮开始选择内容,点击鼠标或按Enter进行复制。按Esc取消选择,上箭头选择父级,下箭头选择子级,左箭头选择前面的相邻元素,右箭头选择后面的相邻元素。按钮可以拖动。Ctrl+c+c激活。

当前为 2019-05-06 提交的版本,查看 最新版本

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         复制为Markdown格式
// @namespace    https://github.com/nameldk/user-script
// @version      0.3.1
// @description  复制网页内容为Markdown格式。点击右上角copy按钮开始选择内容,点击鼠标或按Enter进行复制。按Esc取消选择,上箭头选择父级,下箭头选择子级,左箭头选择前面的相邻元素,右箭头选择后面的相邻元素。按钮可以拖动。Ctrl+c+c激活。
// @author       nameldk
// @require      https://unpkg.com/turndown/dist/turndown.js
// @match        https://*/*
// @match        http://*/*
// @match        file:///*
// @grant        none
// ==/UserScript==

(function () {
    'use strict';

    const CLASS_HINT = "_myhint_";
    let $curElement = null;
    let $btn = document.createElement("div");
    let turndownService = new TurndownService();
    let isHold = 0,
        isDrag = 0;

    function addStyle(css) {
        let s = document.createElement("style");
        s.type = "text/css";
        s.textContent = css;
        document.body.prepend(s);
    }

    function showHint($this) {
        if ($this) {
            $this.classList.add(CLASS_HINT);
        }
    }

    function hideHint($this) {
        if ($this) {
            $this.classList.remove(CLASS_HINT);
        }
    }

    function handleMouseover(e) {
        hideHint($curElement);
        let $target = e.target;
        $curElement = $target;
        showHint($target);
    }

    function handleMouseout(e) {
        let $target = e.target;
        hideHint($target);
    }

    function handleKeyup(e) {
        function isValidNode(node) {
            return node && node.textContent && node.textContent.trim() !== "";
        }
        function findNextNode(node) {
            if (node) {
                var findNode = node.nextElementSibling;
                while(findNode) {
                    if (isValidNode(findNode)) {
                        return findNode;
                    } else {
                        if (findNode.nextElementSibling) {
                            findNode = findNode.nextElementSibling;
                        }
                    }
                }
            }
            return null;
        }

        if (e.keyCode === 13) { // enter
            process(e);
            return false;
        } else if (e.keyCode === 27) { // esc
            disable();
        } else if (e.keyCode === 38) { // arrow up
            if ($curElement && isValidNode($curElement.parentElement)) {
                hideHint($curElement);
                $curElement = $curElement.parentElement;
                showHint($curElement);
            }
        } else if (e.keyCode === 37) { // arrow left
            if ($curElement && isValidNode($curElement.previousElementSibling)) {
                hideHint($curElement);
                $curElement = $curElement.previousElementSibling;
                showHint($curElement);
            }
        } else if (e.keyCode === 40) { // arrow down
            let nextNode = null;
            if ($curElement && (nextNode = findNextNode($curElement.firstElementChild))) {
                hideHint($curElement);
                $curElement = nextNode;
                showHint($curElement);
            }
        } else if (e.keyCode === 39) { // arrow right
            if ($curElement && isValidNode($curElement.nextElementSibling)) {
                hideHint($curElement);
                $curElement = $curElement.nextElementSibling;
                showHint($curElement);
            }
        }
    }

    function disableScroll(e) {
        if ([38, 40, 37, 39].indexOf(e.keyCode) > -1) {
            e.preventDefault();
        }
    }

    function handleClick(e) {
        process(e);
        return false;
    }

    function process(e) {
        if ($curElement) {
            e.preventDefault();
            copyIt($curElement);
            disable();
            showTips();
        }
    }

    function showTips() {
        let t = document.createElement("div");
        t.style.position = "fixed";
        t.style.width = "80px";
        t.style.height = "24px";
        t.style.lineHeight = "24px";
        t.style.top = "10px";
        t.style.right = "50%";
        t.style.background = "#68af02";
        t.style.fontSize = "14px";
        t.style.color = "#fff";
        t.style.textAlign = "center";
        t.style.borderRadius = "5px";
        t.style.marginLeft = "300px";
        t.style.zIndex = 10000;
        t.innerHTML = "复制成功";

        document.body.prepend(t);
        setTimeout(function () {
            document.body.removeChild(t);
        }, 1000);
    }

    function copyIt($curElement) {
        if ($curElement) {
            let html = $curElement.innerHTML;
            html = html.replace(/(<img.+\s?src=")(\/\/.+?")/gi, "$1" + document.location.protocol + "$2")
                .replace(/(<img.+\s?src=")(\/.+?")/gi, "$1" + document.location.origin + "$2")
                .replace(/(<img.+\s?src=")(?!http)(.+?")/gi, "$1" + document.location.origin +
                         (document.location.pathname.substring(0, document.location.pathname.lastIndexOf('/'))) + "/$2")
                .replace(/(<a.+?href=")(.*?")(.*?<\/a>)/gi, parseHref);
            let markdown = turndownService.turndown(html);
            markdown = markdown.replace(/<img.+?>/g, "");
            copyToClipboard(markdown);
        }
    }

    function parseHref(match, head, link, tail){
        if (link.substr(0, 4) === 'http') {
            return head + link.replace(/#.*/,"") + tail;
        }
        var path = document.location.pathname.split('/');
        path.pop();
        if (link[0] === '#' || link.substr(0, 10) === 'javascript' || link === '"') { // "#" "javascript:" ""
            return head + '#"' + tail;
        } else if (link[0] === '.' && link[1] === '/'){ // "./xxx"
            return head + document.location.origin + path.join('/') + link.substring(1) + tail;
        } else if (link[0] === '.' && link[1] === '.' && link[2] === '/') { // ../xxx
            var p2Arr = link.split('../'),
                tmpRes = [p2Arr.pop()];
            path.pop();
            while(p2Arr.length){
                var t = p2Arr.pop();
                if (t === ''){
                    tmpRes.unshift(path.pop());
                }
            }
            return head + document.location.origin + tmpRes.join('/') + tail;
        } else if (link.match(/^\/\/.*/)) { // //xxx.com
            return head + document.location.protocol + link + tail;
        } else if (link.match(/^\/.*/)) { // /abc
            return head + document.location.origin + link + tail;
        } else { // "abc/xxx"
            return head + document.location.origin + path.join("/") + '/' + link + tail;
        }
    }

    function copyToClipboard(text) {
        const input = document.createElement('textarea');
        input.style.position = 'fixed';
        input.style.opacity = 0;
        input.value = text;
        document.body.appendChild(input);
        input.select();
        let res = document.execCommand('Copy');
        document.body.removeChild(input);
        return res;
    }

    function enable() {
        document.addEventListener("mouseover", handleMouseover);
        document.addEventListener("mouseout", handleMouseout);
        document.addEventListener("click", handleClick);
        document.addEventListener("keyup", handleKeyup);
        window.addEventListener("keydown", disableScroll, false);
    }

    function disable() {
        if ($curElement) {
            hideHint($curElement);
            $curElement = null;
        }

        document.removeEventListener("mouseover", handleMouseover);
        document.removeEventListener("mouseout", handleMouseout);
        document.removeEventListener("click", handleClick);
        document.removeEventListener("keyup", handleKeyup);
        window.removeEventListener("keydown", disableScroll, false);

        $btn.style.display = "block";
    }

    function genDoublePressHandler(keyCode, callback, params) {
        var intval = 500;
        var lastKeypressTime = 0;
        var useCtrl = params && params.useCtrl;
        var pressCtrl = 0;
        if (useCtrl) {
            document.addEventListener('keydown', function(e) {
                if (useCtrl && e.keyCode === 17) {
                    pressCtrl = 1;
                }
            }, false);
            document.addEventListener('keyup', function(e) {
                if (useCtrl && e.keyCode === 17) {
                    pressCtrl = 0;
                }
            }, false);
        }
        return function(e) {
            var now = +new Date;
            if (e.keyCode === keyCode) {
                if ((now - lastKeypressTime <= intval) && (!useCtrl || useCtrl && pressCtrl)) {
                    callback && callback(e);
                    lastKeypressTime = 0;
                }
            }
            lastKeypressTime = now;
        };
    }

    function initBtn() {
        let topDiff = 0,
            leftDiff = 0;

        $btn.style.position = "fixed";
        $btn.style.width = "44px";
        $btn.style.height = "22px";
        $btn.style.lineHeight = "22px";
        $btn.style.top = "14%";
        $btn.style.right = "1%";
        $btn.style.background = "#0084ff";
        $btn.style.fontSize = "14px";
        $btn.style.color = "#fff";
        $btn.style.textAlign = "center";
        $btn.style.borderRadius = "6px";
        $btn.style.zIndex = 10000;
        $btn.style.cursor = "pointer";
        $btn.style.opacity = 0.1;
        $btn.innerHTML = "copy";

        $btn.addEventListener("click", function () {
            if (isDrag) {
                return false;
            }
            enable();
            this.style.display = "none";
        });

        $btn.addEventListener("mouseover", function (e) {
            this.style.opacity = 1;
        });

        $btn.addEventListener("mouseout", function () {
            this.style.opacity = 0.1;
        });

        $btn.addEventListener("mousedown", function (e) {
            isHold = 1;
            leftDiff = e.pageX - this.offsetLeft;
            topDiff = e.pageY - this.offsetTop;

            $btn.onmousemove = function (e) {
                if (isHold) {
                    isDrag = 1;
                }
                if (isDrag) {
                    this.style.top = (e.pageY - topDiff) + "px";
                    this.style.left = (e.pageX - leftDiff) + "px";
                    this.style.right = "auto";
                }
            };
        });

        document.addEventListener("mouseup", function () {
            setTimeout(function () {
                isHold = 0;
                isDrag = 0;
                $btn.onmousemove = null;
            }, 0);
        });

        // Ctrl+c+c
        document.addEventListener('keyup', genDoublePressHandler(67, function (e) {
            $btn.click();
        },{"useCtrl":1}), false);

    }

    function init() {
        if (!document.body) {
            console.warn("no body");
            return;
        }
        addStyle("." + CLASS_HINT + "{background-color: #fafafa; outline: 2px dashed #1976d2; opacity: .8; cursor: pointer; -webkit-transition: opacity .5s ease; transition: opacity .5s ease;}");
        document.body.prepend($btn);
        initBtn();
    }

    init();
})();