您当前的位置：首页 > 计算机 > 编程开发 > JavaScript

一键将HTML网页选中区块复制转换为Markdown格式(支持table转换)

时间：09-19来源：作者：点击数：35

工具

浏览器插件：tampermonkey 油猴

JS脚本：nameldk 的《复制为Markdown格式》 0.3.1版本

基础上添加代码。

需求

程序员做笔记最简洁的就是markdown了，html转存为markdown格式就好了，样式统一，编辑也方便。

上面的工具和脚本，转换代码块、图片、超链接文字都很好，支持标签区块识别(像是印象笔记或有道云笔记的网页剪辑那种)，随选随转，十分方便。

唯一的缺点就是不支持table标签。

实现

在原有脚本基础上修改，使其支持table标签转换。测试了几个想保存的页面，没什么问题。至于其他网页碰到再说，暂不确定兼容情况。

在转换规则中，添加tr、td&th、table规则

删掉顶部的// @require那句，将其引用的turndown.js内容完整复制，粘贴到在JS脚本头部，然后在其中添加table转换的部分。


  // // ==============================================================================
  // // 在turndown中添加的转换table部分(author:watfe)
  // // ==============================================================================


  rules.td = {
    filter: ['td'],
    replacement: function (content, node, options) {
        content = content.trim();
        content = content.replace(/\|/g,'/');
        content = content.replace(/\n+/g,' <br> ');
        content = '|'+content
        // console.log('td:'+content);
        return content
    }
  };

  rules.th = {
    filter: ['th'],
    replacement: function (content, node, options) {
        content = content.trim();
        content = content.replace(/\|/g,'/');
        content = content.replace(/\n+/g,' <br> ');
        content = '|#$&%th$#%&'+content
        if (node.getAttribute('colspan')!=null){ //如果表头存在合并单元格，对其进行处理
            content = content+repeatStringNumTimes('|', node.getAttribute('colspan'));
        }
        // console.log('th:'+content);
        return content
    }
  };

  rules.tr = {
    filter: ['tr'],
    replacement: function (content, node, options) {
        content = '|\n'+content.trim();
        // console.log('tr:'+content);
        return content
    }
  };

  function repeatStringNumTimes(str, num) { //字符串重复N次
    let repeatStr = '';
    for(let i = 0; i < num; i++){
      repeatStr += str;
    }
    return repeatStr;
  }

  rules.table = {
    filter: ['table'],
    replacement: function (content, node, options) {
      // 删首尾空，删除最前面多余的|，并在最后补全|
      //console.log('table1:'+content);
      content = content.trim();
      content = content.replace(/\n+/g, '\n');
      content = content.replace(/\n\|\n/g, '|\n');
      if (content.indexOf('|\n')===0){
        content = content.substring(1, content.length)+'|';
      }
      content = content.trim();
      // 如果表最前端包含<caption>表名标签的，通过下面代码优化让<caption>变成独立一行
      //console.log('table2:'+content);
      var captionLine = '';
      if (content.slice(0,1)!='|' && (content.slice(-1)!='|')){
          captionLine = content.slice(0,content.indexOf('|\n'));//captionn那行
          content = content.slice(content.indexOf('|\n')+2);
          content = content+'|'
      }
      // 检查表格包含几个|，数字减1就是列数，模拟出markdown表格中间的---：
      var verticalLineCount = 0;
      var strs = new Array();
      var thExist = false;
      strs = content.split('\n');
      for (let i=0; i<strs.length; i++ ){ // 计算最多列数
          if(strs[i].indexOf('|')>=0){
              let tempnum = strs[i].match(/\|/ig).length;
              if (tempnum>verticalLineCount){
                  verticalLineCount = tempnum;
              }
          }
      }
      var buildTh = repeatStringNumTimes('| ',verticalLineCount).trim(); // 构造没有表头时候，markdown需要的表头 比如：| | | |
      var tableMDLine = '|'+repeatStringNumTimes('---|',verticalLineCount-1); // 构造markdown表中间的横线 比如：|---|---|---|
      // 检查是否包含表头
      //console.log('table3:'+content);
      if (content.indexOf('|#$&%th$#%&')>=0){
          content = content.replace(/\|#\$&%th\$#%&/g, '|');
          content = content.replace('\n','\n'+tableMDLine+'\n');
      }
      else{
          content = buildTh+'\n'+tableMDLine+'\n'+ content;
      }
      content = '\n'+captionLine+'\n\n'+content+'\n\n';
      //console.log('table4:'+content);
      return content
    }
  };

  // // ==============================================================================
  // // 添加完毕
  // // ==============================================================================

调整markdown输出格式

比如：h1用#而不是下划线，代码块用```等等。

在JS脚本建立TurndownService实例前，加入这些配置。

    // ==============================================================================
    // 根据turndown文档，调整一些参数，让转化出来的markdown格式，满足自己的需要
    // https://github.com/domchristie/turndown
    // ==============================================================================
    let options = {
      headingStyle: 'atx',
      bulletListMarker: '+',
      codeBlockStyle: 'fenced',
      emDelimiter: '*'
    };
    // ==============================================================================
    // 添加完毕
    // ==============================================================================
    let turndownService = new TurndownService(options);

其他bug修正

.replace(/(<a.+?href=")(.*?")(.*?<\/a>)/gi, parseHref);修改为.replace(/(<a.+?href=")(.*?)(".*?<\/a>)/gi, parseHref);

原本的代码，因为这个错误会导致herf链接包含#号时出错

测试

转换成功

最终完整js代码

使用方法:

tampermonkey中选"添加新脚本", 清空默认内容, 复制代码粘贴到文本框中, 然后点"文件", 点"保存"即可

// ==UserScript==
// @name         Markdown
// @name         网页转换为Markdown格式
// @version      0.0.1
// @description  复制网页内容为Markdown格式。点击右上角copy按钮开始选择内容，点击鼠标或按Enter进行复制。按Esc取消选择，上箭头选择父级，下箭头选择子级，左箭头选择前面的相邻元素，右箭头选择后面的相邻元素。按钮可以拖动。Ctrl+c+c激活。
// @author       nameldk
// @author       watfe基于nameldk的"复制为Markdown格式.js"和"https://unpkg.com/turndown/dist/turndown.js"的基础上修改
// @match        https://*/*
// @match        http://*/*
// @match        file:///*
// @grant        none
// ==/UserScript==


// ==============================================================
// 直接导入turndown@6.0.0
// https://unpkg.com/turndown/dist/turndown.js
var TurndownService = (function () {
  'use strict';

  function extend (destination) {
    for (var i = 1; i < arguments.length; i++) {
      var source = arguments[i];
      for (var key in source) {
        if (source.hasOwnProperty(key)) destination[key] = source[key];
      }
    }
    return destination
  }

  function repeat (character, count) {
    return Array(count + 1).join(character)
  }

  var blockElements = [
    'address', 'article', 'aside', 'audio', 'blockquote', 'body', 'canvas',
    'center', 'dd', 'dir', 'div', 'dl', 'dt', 'fieldset', 'figcaption',
    'figure', 'footer', 'form', 'frameset', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6',
    'header', 'hgroup', 'hr', 'html', 'isindex', 'li', 'main', 'menu', 'nav',
    'noframes', 'noscript', 'ol', 'output', 'p', 'pre', 'section', 'table',
    'tbody', 'td', 'tfoot', 'th', 'thead', 'tr',
    'ul'
  ];

  function isBlock (node) {
    return blockElements.indexOf(node.nodeName.toLowerCase()) !== -1
  }

  var voidElements = [
    'area', 'base', 'br', 'col', 'command', 'embed', 'hr', 'img', 'input',
    'keygen', 'link', 'meta', 'param', 'source', 'track', 'wbr'
  ];

  function isVoid (node) {
    return voidElements.indexOf(node.nodeName.toLowerCase()) !== -1
  }

  var voidSelector = voidElements.join();
  function hasVoid (node) {
    return node.querySelector && node.querySelector(voidSelector)
  }

  var rules = {};

  rules.paragraph = {
    filter: 'p',

    replacement: function (content) {
      return '\n\n' + content + '\n\n'
    }
  };

  rules.lineBreak = {
    filter: 'br',

    replacement: function (content, node, options) {
      return options.br + '\n'
    }
  };

  rules.heading = {
    filter: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'],

    replacement: function (content, node, options) {
      var hLevel = Number(node.nodeName.charAt(1));

      if (options.headingStyle === 'setext' && hLevel < 3) {
        var underline = repeat((hLevel === 1 ? '=' : '-'), content.length);
        return (
          '\n\n' + content + '\n' + underline + '\n\n'
        )
      } else {
        return '\n\n' + repeat('#', hLevel) + ' ' + content + '\n\n'
      }
    }
  };

  // // ==============================================================================
  // // 转换table(自己写的，可能不太完善)
  // // ==============================================================================

  rules.td = {
    filter: ['td'],
    replacement: function (content, node, options) {
        content = content.trim();
        content = content.replace(/\|/g,'/');
        content = content.replace(/\n+/g,' <br> ');
        content = '|'+content
        // console.log('td:'+content);
        return content
    }
  };

  rules.th = {
    filter: ['th'],
    replacement: function (content, node, options) {
        content = content.trim();
        content = content.replace(/\|/g,'/');
        content = content.replace(/\n+/g,' <br> ');
        content = '|#$&%th$#%&'+content
        if (node.getAttribute('colspan')!=null){ //如果表头存在合并单元格，对其进行处理
            content = content+repeatStringNumTimes('|', node.getAttribute('colspan'));
        }
        // console.log('th:'+content);
        return content
    }
  };

  rules.tr = {
    filter: ['tr'],
    replacement: function (content, node, options) {
        content = '|\n'+content.trim();
        // console.log('tr:'+content);
        return content
    }
  };

  function repeatStringNumTimes(str, num) { //字符串重复N次
    let repeatStr = '';
    for(let i = 0; i < num; i++){
      repeatStr += str;
    }
    return repeatStr;
  }

  rules.table = {
    filter: ['table'],
    replacement: function (content, node, options) {
      // 删首尾空，删除最前面多余的|，并在最后补全|
      //console.log('table1:'+content);
      content = content.trim();
      content = content.replace(/\n+/g, '\n');
      content = content.replace(/\n\|\n/g, '|\n');
      if (content.indexOf('|\n')===0){
        content = content.substring(1, content.length)+'|';
      }
      content = content.trim();
      // 如果表最前端包含<caption>表名标签的，通过下面代码优化让<caption>变成独立一行
      //console.log('table2:'+content);
      var captionLine = '';
      if (content.slice(0,1)!='|' && (content.slice(-1)!='|')){
          captionLine = content.slice(0,content.indexOf('|\n'));//captionn那行
          content = content.slice(content.indexOf('|\n')+2);
          content = content+'|'
      }
      // 检查表格包含几个|，数字减1就是列数，模拟出markdown表格中间的---：
      var verticalLineCount = 0;
      var strs = new Array();
      var thExist = false;
      strs = content.split('\n');
      for (let i=0; i<strs.length; i++ ){ // 计算最多列数
          if(strs[i].indexOf('|')>=0){
              let tempnum = strs[i].match(/\|/ig).length;
              if (tempnum>verticalLineCount){
                  verticalLineCount = tempnum;
              }
          }
      }
      var buildTh = repeatStringNumTimes('| ',verticalLineCount).trim(); // 构造没有表头时候，markdown需要的表头 比如：| | | |
      var tableMDLine = '|'+repeatStringNumTimes('---|',verticalLineCount-1); // 构造markdown表中间的横线 比如：|---|---|---|
      // 检查是否包含表头
      //console.log('table3:'+content);
      if (content.indexOf('|#$&%th$#%&')>=0){
          content = content.replace(/\|#\$&%th\$#%&/g, '|');
          content = content.replace('\n','\n'+tableMDLine+'\n');
      }
      else{
          content = buildTh+'\n'+tableMDLine+'\n'+ content;
      }
      content = '\n'+captionLine+'\n\n'+content+'\n\n';
      //console.log('table4:'+content);
      return content
    }
  };
  // // ==============================================================================

  rules.blockquote = {
    filter: 'blockquote',

    replacement: function (content) {
      content = content.replace(/^\n+|\n+$/g, '');
      content = content.replace(/^/gm, '> ');
      return '\n\n' + content + '\n\n'
    }
  };

  rules.list = {
    filter: ['ul', 'ol'],

    replacement: function (content, node) {
      var parent = node.parentNode;
      if (parent.nodeName === 'LI' && parent.lastElementChild === node) {
        return '\n' + content
      } else {
        return '\n\n' + content + '\n\n'
      }
    }
  };

  rules.listItem = {
    filter: 'li',

    replacement: function (content, node, options) {
      content = content
        .replace(/^\n+/, '') // remove leading newlines
        .replace(/\n+$/, '\n') // replace trailing newlines with just a single one
        .replace(/\n/gm, '\n    '); // indent
      var prefix = options.bulletListMarker + '   ';
      var parent = node.parentNode;
      if (parent.nodeName === 'OL') {
        var start = parent.getAttribute('start');
        var index = Array.prototype.indexOf.call(parent.children, node);
        prefix = (start ? Number(start) + index : index + 1) + '.  ';
      }
      return (
        prefix + content + (node.nextSibling && !/\n$/.test(content) ? '\n' : '')
      )
    }
  };

  rules.indentedCodeBlock = {
    filter: function (node, options) {
      return (
        options.codeBlockStyle === 'indented' &&
        node.nodeName === 'PRE' &&
        node.firstChild &&
        node.firstChild.nodeName === 'CODE'
      )
    },

    replacement: function (content, node, options) {
      return (
        '\n\n    ' +
        node.firstChild.textContent.replace(/\n/g, '\n    ') +
        '\n\n'
      )
    }
  };

  rules.fencedCodeBlock = {
    filter: function (node, options) {
      return (
        options.codeBlockStyle === 'fenced' &&
        node.nodeName === 'PRE' &&
        node.firstChild &&
        node.firstChild.nodeName === 'CODE'
      )
    },

    replacement: function (content, node, options) {
      var className = node.firstChild.className || '';
      var language = (className.match(/language-(\S+)/) || [null, ''])[1];
      var code = node.firstChild.textContent;

      var fenceChar = options.fence.charAt(0);
      var fenceSize = 3;
      var fenceInCodeRegex = new RegExp('^' + fenceChar + '{3,}', 'gm');

      var match;
      while ((match = fenceInCodeRegex.exec(code))) {
        if (match[0].length >= fenceSize) {
          fenceSize = match[0].length + 1;
        }
      }

      var fence = repeat(fenceChar, fenceSize);

      return (
        '\n\n' + fence + language + '\n' +
        code.replace(/\n$/, '') +
        '\n' + fence + '\n\n'
      )
    }
  };

  rules.horizontalRule = {
    filter: 'hr',

    replacement: function (content, node, options) {
      return '\n\n' + options.hr + '\n\n'
    }
  };

  rules.inlineLink = {
    filter: function (node, options) {
      return (
        options.linkStyle === 'inlined' &&
        node.nodeName === 'A' &&
        node.getAttribute('href')
      )
    },
    replacement: function (content, node) { //console.log('content:'+content); console.log('node:'+node);
      var href = node.getAttribute('href'); //console.log('href:'+href);
      var title = node.title ? ' "' + node.title + '"' : ''; //console.log('title:'+title);
      return '[' + content + '](' + href + title + ')'
    }
  };

  rules.referenceLink = {
    filter: function (node, options) {
      return (
        options.linkStyle === 'referenced' &&
        node.nodeName === 'A' &&
        node.getAttribute('href')
      )
    },

    replacement: function (content, node, options) {
      var href = node.getAttribute('href');
      var title = node.title ? ' "' + node.title + '"' : '';
      var replacement;
      var reference;

      switch (options.linkReferenceStyle) {
        case 'collapsed':
          replacement = '[' + content + '][]';
          reference = '[' + content + ']: ' + href + title;
          break
        case 'shortcut':
          replacement = '[' + content + ']';
          reference = '[' + content + ']: ' + href + title;
          break
        default:
          var id = this.references.length + 1;
          replacement = '[' + content + '][' + id + ']';
          reference = '[' + id + ']: ' + href + title;
      }

      this.references.push(reference);
      return replacement
    },

    references: [],

    append: function (options) {
      var references = '';
      if (this.references.length) {
        references = '\n\n' + this.references.join('\n') + '\n\n';
        this.references = []; // Reset references
      }
      return references
    }
  };

  rules.emphasis = {
    filter: ['em', 'i'],

    replacement: function (content, node, options) {
      if (!content.trim()) return ''
      return options.emDelimiter + content + options.emDelimiter
    }
  };

  rules.strong = {
    filter: ['strong', 'b'],

    replacement: function (content, node, options) {
      if (!content.trim()) return ''
      return options.strongDelimiter + content + options.strongDelimiter
    }
  };

  rules.code = {
    filter: function (node) {
      var hasSiblings = node.previousSibling || node.nextSibling;
      var isCodeBlock = node.parentNode.nodeName === 'PRE' && !hasSiblings;

      return node.nodeName === 'CODE' && !isCodeBlock
    },

    replacement: function (content) {
      if (!content.trim()) return ''

      var delimiter = '`';
      var leadingSpace = '';
      var trailingSpace = '';
      var matches = content.match(/`+/gm);
      if (matches) {
        if (/^`/.test(content)) leadingSpace = ' ';
        if (/`$/.test(content)) trailingSpace = ' ';
        while (matches.indexOf(delimiter) !== -1) delimiter = delimiter + '`';
      }

      return delimiter + leadingSpace + content + trailingSpace + delimiter
    }
  };

  rules.image = {
    filter: 'img',

    replacement: function (content, node) {
      var alt = node.alt || '';
      var src = node.getAttribute('src') || '';
      var title = node.title || '';
      var titlePart = title ? ' "' + title + '"' : '';
      return src ? '![' + alt + ']' + '(' + src + titlePart + ')' : ''
    }
  };

  /**
   * Manages a collection of rules used to convert HTML to Markdown
   */

  function Rules (options) {
    this.options = options;
    this._keep = [];
    this._remove = [];

    this.blankRule = {
      replacement: options.blankReplacement
    };

    this.keepReplacement = options.keepReplacement;

    this.defaultRule = {
      replacement: options.defaultReplacement
    };

    this.array = [];
    for (var key in options.rules) this.array.push(options.rules[key]);
  }

  Rules.prototype = {
    add: function (key, rule) {
      this.array.unshift(rule);
    },

    keep: function (filter) {
      this._keep.unshift({
        filter: filter,
        replacement: this.keepReplacement
      });
    },

    remove: function (filter) {
      this._remove.unshift({
        filter: filter,
        replacement: function () {
          return ''
        }
      });
    },

    forNode: function (node) {
      if (node.isBlank) return this.blankRule
      var rule;

      if ((rule = findRule(this.array, node, this.options))) return rule
      if ((rule = findRule(this._keep, node, this.options))) return rule
      if ((rule = findRule(this._remove, node, this.options))) return rule

      return this.defaultRule
    },

    forEach: function (fn) {
      for (var i = 0; i < this.array.length; i++) fn(this.array[i], i);
    }
  };

  function findRule (rules, node, options) {
    for (var i = 0; i < rules.length; i++) {
      var rule = rules[i];
      if (filterValue(rule, node, options)) return rule
    }
    return void 0
  }

  function filterValue (rule, node, options) {
    var filter = rule.filter;
    if (typeof filter === 'string') {
      if (filter === node.nodeName.toLowerCase()) return true
    } else if (Array.isArray(filter)) {
      if (filter.indexOf(node.nodeName.toLowerCase()) > -1) return true
    } else if (typeof filter === 'function') {
      if (filter.call(rule, node, options)) return true
    } else {
      throw new TypeError('`filter` needs to be a string, array, or function')
    }
  }

  /**
   * The collapseWhitespace function is adapted from collapse-whitespace
   * by Luc Thevenard.
   *
   * The MIT License (MIT)
   *
   * Copyright (c) 2014 Luc Thevenard <lucthevenard@gmail.com>
   *
   * Permission is hereby granted, free of charge, to any person obtaining a copy
   * of this software and associated documentation files (the "Software"), to deal
   * in the Software without restriction, including without limitation the rights
   * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
   * copies of the Software, and to permit persons to whom the Software is
   * furnished to do so, subject to the following conditions:
   *
   * The above copyright notice and this permission notice shall be included in
   * all copies or substantial portions of the Software.
   *
   * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
   * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
   * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
   * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
   * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
   * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
   * THE SOFTWARE.
   */

  /**
   * collapseWhitespace(options) removes extraneous whitespace from an the given element.
   *
   * @param {Object} options
   */
  function collapseWhitespace (options) {
    var element = options.element;
    var isBlock = options.isBlock;
    var isVoid = options.isVoid;
    var isPre = options.isPre || function (node) {
      return node.nodeName === 'PRE'
    };

    if (!element.firstChild || isPre(element)) return

    var prevText = null;
    var prevVoid = false;

    var prev = null;
    var node = next(prev, element, isPre);

    while (node !== element) {
      if (node.nodeType === 3 || node.nodeType === 4) { // Node.TEXT_NODE or Node.CDATA_SECTION_NODE
        var text = node.data.replace(/[ \r\n\t]+/g, ' ');

        if ((!prevText || / $/.test(prevText.data)) &&
            !prevVoid && text[0] === ' ') {
          text = text.substr(1);
        }

        // `text` might be empty at this point.
        if (!text) {
          node = remove(node);
          continue
        }

        node.data = text;

        prevText = node;
      } else if (node.nodeType === 1) { // Node.ELEMENT_NODE
        if (isBlock(node) || node.nodeName === 'BR') {
          if (prevText) {
            prevText.data = prevText.data.replace(/ $/, '');
          }

          prevText = null;
          prevVoid = false;
        } else if (isVoid(node)) {
          // Avoid trimming space around non-block, non-BR void elements.
          prevText = null;
          prevVoid = true;
        }
      } else {
        node = remove(node);
        continue
      }

      var nextNode = next(prev, node, isPre);
      prev = node;
      node = nextNode;
    }

    if (prevText) {
      prevText.data = prevText.data.replace(/ $/, '');
      if (!prevText.data) {
        remove(prevText);
      }
    }
  }

  /**
   * remove(node) removes the given node from the DOM and returns the
   * next node in the sequence.
   *
   * @param {Node} node
   * @return {Node} node
   */
  function remove (node) {
    var next = node.nextSibling || node.parentNode;

    node.parentNode.removeChild(node);

    return next
  }

  /**
   * next(prev, current, isPre) returns the next node in the sequence, given the
   * current and previous nodes.
   *
   * @param {Node} prev
   * @param {Node} current
   * @param {Function} isPre
   * @return {Node}
   */
  function next (prev, current, isPre) {
    if ((prev && prev.parentNode === current) || isPre(current)) {
      return current.nextSibling || current.parentNode
    }

    return current.firstChild || current.nextSibling || current.parentNode
  }

  /*
   * Set up window for Node.js
   */

  var root = (typeof window !== 'undefined' ? window : {});

  /*
   * Parsing HTML strings
   */

  function canParseHTMLNatively () {
    var Parser = root.DOMParser;
    var canParse = false;

    // Adapted from https://gist.github.com/1129031
    // Firefox/Opera/IE throw errors on unsupported types
    try {
      // WebKit returns null on unsupported types
      if (new Parser().parseFromString('', 'text/html')) {
        canParse = true;
      }
    } catch (e) {}

    return canParse
  }

  function createHTMLParser () {
      var Parser = function () {};
      if (shouldUseActiveX()) {
          Parser.prototype.parseFromString = function (string) {
              var doc = new window.ActiveXObject('htmlfile'); //console.log('createHTMLParser1:'+string);
              doc.designMode = 'on'; // disable on-page scripts
              doc.open();
              doc.write(string);
              doc.close();
              return doc
          };
      } else {
          Parser.prototype.parseFromString = function (string) {
              var doc = document.implementation.createHTMLDocument(''); //console.log('createHTMLParser2:'+string);
              doc.open();
              doc.write(string);
              doc.close();
              return doc
          };
      }
      return Parser
  }

  function shouldUseActiveX () {
    var useActiveX = false;
    try {
      document.implementation.createHTMLDocument('').open();
    } catch (e) {
      if (window.ActiveXObject) useActiveX = true;
    }
    return useActiveX
  }

  var HTMLParser = canParseHTMLNatively() ? root.DOMParser : createHTMLParser();

  function RootNode (input) {
    var root;
    if (typeof input === 'string') {
      var doc = htmlParser().parseFromString(
        // DOM parsers arrange elements in the <head> and <body>.
        // Wrapping in a custom element ensures elements are reliably arranged in
        // a single element.
        '<x-turndown id="turndown-root">' + input + '</x-turndown>',
        'text/html'
      );
      root = doc.getElementById('turndown-root');
    } else {
      root = input.cloneNode(true);
    }
    collapseWhitespace({
      element: root,
      isBlock: isBlock,
      isVoid: isVoid
    });

    return root
  }

  var _htmlParser;
  function htmlParser () {
    _htmlParser = _htmlParser || new HTMLParser();
    return _htmlParser
  }

  function Node (node) {
    node.isBlock = isBlock(node);
    node.isCode = node.nodeName.toLowerCase() === 'code' || node.parentNode.isCode;
    node.isBlank = isBlank(node);
    node.flankingWhitespace = flankingWhitespace(node);
    return node
  }

  function isBlank (node) {
    return (
      ['A', 'TH', 'TD', 'IFRAME', 'SCRIPT', 'AUDIO', 'VIDEO'].indexOf(node.nodeName) === -1 &&
      /^\s*$/i.test(node.textContent) &&
      !isVoid(node) &&
      !hasVoid(node)
    )
  }

  function flankingWhitespace (node) {
    var leading = '';
    var trailing = '';

    if (!node.isBlock) {
      var hasLeading = /^\s/.test(node.textContent);
      var hasTrailing = /\s$/.test(node.textContent);
      var blankWithSpaces = node.isBlank && hasLeading && hasTrailing;

      if (hasLeading && !isFlankedByWhitespace('left', node)) {
        leading = ' ';
      }

      if (!blankWithSpaces && hasTrailing && !isFlankedByWhitespace('right', node)) {
        trailing = ' ';
      }
    }

    return { leading: leading, trailing: trailing }
  }

  function isFlankedByWhitespace (side, node) {
    var sibling;
    var regExp;
    var isFlanked;

    if (side === 'left') {
      sibling = node.previousSibling;
      regExp = / $/;
    } else {
      sibling = node.nextSibling;
      regExp = /^ /;
    }

    if (sibling) {
      if (sibling.nodeType === 3) {
        isFlanked = regExp.test(sibling.nodeValue);
      } else if (sibling.nodeType === 1 && !isBlock(sibling)) {
        isFlanked = regExp.test(sibling.textContent);
      }
    }
    return isFlanked
  }

  var reduce = Array.prototype.reduce;
  var leadingNewLinesRegExp = /^\n*/;
  var trailingNewLinesRegExp = /\n*$/;
  var escapes = [
    [/\\/g, '\\\\'],
    [/\*/g, '\\*'],
    [/^-/g, '\\-'],
    [/^\+ /g, '\\+ '],
    [/^(=+)/g, '\\$1'],
    [/^(#{1,6}) /g, '\\$1 '],
    [/`/g, '\\`'],
    [/^~~~/g, '\\~~~'],
    [/\[/g, '\\['],
    [/\]/g, '\\]'],
    [/^>/g, '\\>'],
    [/_/g, '\\_'],
    [/^(\d+)\. /g, '$1\\. ']
  ];

  function TurndownService (options) {
    if (!(this instanceof TurndownService)) return new TurndownService(options)

    var defaults = {
      rules: rules,
      headingStyle: 'setext',
      hr: '* * *',
      bulletListMarker: '*',
      codeBlockStyle: 'indented',
      fence: '```',
      emDelimiter: '_',
      strongDelimiter: '**',
      linkStyle: 'inlined',
      linkReferenceStyle: 'full',
      br: '  ',
      blankReplacement: function (content, node) {
        return node.isBlock ? '\n\n' : ''
      },
      keepReplacement: function (content, node) {
        return node.isBlock ? '\n\n' + node.outerHTML + '\n\n' : node.outerHTML
      },
      defaultReplacement: function (content, node) {
        return node.isBlock ? '\n\n' + content + '\n\n' : content
      }
    };
    this.options = extend({}, defaults, options);
    this.rules = new Rules(this.options);
  }

  TurndownService.prototype = {
    /**
     * The entry point for converting a string or DOM node to Markdown
     * @public
     * @param {String|HTMLElement} input The string or DOM node to convert
     * @returns A Markdown representation of the input
     * @type String
     */

    turndown: function (input) {
      //console.log(input);
      if (!canConvert(input)) { //copy点击后传入
        throw new TypeError(
          input + ' is not a string, or an element/document/fragment node.'
        )
      }

      if (input === '') return ''

      var output = process.call(this, new RootNode(input)); //处理完毕后返回内容
      return postProcess.call(this, output)
    },

    /**
     * Add one or more plugins
     * @public
     * @param {Function|Array} plugin The plugin or array of plugins to add
     * @returns The Turndown instance for chaining
     * @type Object
     */

    use: function (plugin) {
      if (Array.isArray(plugin)) {
        for (var i = 0; i < plugin.length; i++) this.use(plugin[i]);
      } else if (typeof plugin === 'function') {
        plugin(this);
      } else {
        throw new TypeError('plugin must be a Function or an Array of Functions')
      }
      return this
    },

    /**
     * Adds a rule
     * @public
     * @param {String} key The unique key of the rule
     * @param {Object} rule The rule
     * @returns The Turndown instance for chaining
     * @type Object
     */

    addRule: function (key, rule) {
      this.rules.add(key, rule);
      return this
    },

    /**
     * Keep a node (as HTML) that matches the filter
     * @public
     * @param {String|Array|Function} filter The unique key of the rule
     * @returns The Turndown instance for chaining
     * @type Object
     */

    keep: function (filter) {
      this.rules.keep(filter);
      return this
    },

    /**
     * Remove a node that matches the filter
     * @public
     * @param {String|Array|Function} filter The unique key of the rule
     * @returns The Turndown instance for chaining
     * @type Object
     */

    remove: function (filter) {
      this.rules.remove(filter);
      return this
    },

    /**
     * Escapes Markdown syntax
     * @public
     * @param {String} string The string to escape
     * @returns A string with Markdown syntax escaped
     * @type String
     */

    escape: function (string) {
      return escapes.reduce(function (accumulator, escape) {
        return accumulator.replace(escape[0], escape[1])
      }, string)
    }
  };

  /**
   * Reduces a DOM node down to its Markdown string equivalent
   * @private
   * @param {HTMLElement} parentNode The node to convert
   * @returns A Markdown representation of the node
   * @type String
   */

  function process (parentNode) {
    var self = this;
    return reduce.call(parentNode.childNodes, function (output, node) {
      node = new Node(node);

      var replacement = '';
      if (node.nodeType === 3) {
        replacement = node.isCode ? node.nodeValue : self.escape(node.nodeValue);
      } else if (node.nodeType === 1) {
        replacement = replacementForNode.call(self, node);
      }

      return join(output, replacement)
    }, '')
  }

  /**
   * Appends strings as each rule requires and trims the output
   * @private
   * @param {String} output The conversion output
   * @returns A trimmed version of the ouput
   * @type String
   */

  function postProcess (output) {
    var self = this;
    this.rules.forEach(function (rule) {
      if (typeof rule.append === 'function') {
        output = join(output, rule.append(self.options));
      }
    });

    return output.replace(/^[\t\r\n]+/, '').replace(/[\t\r\n\s]+$/, '')
  }

  /**
   * Converts an element node to its Markdown equivalent
   * @private
   * @param {HTMLElement} node The node to convert
   * @returns A Markdown representation of the node
   * @type String
   */

  function replacementForNode (node) {
    var rule = this.rules.forNode(node);
    var content = process.call(this, node);
    var whitespace = node.flankingWhitespace;
    if (whitespace.leading || whitespace.trailing) content = content.trim();
    return (
      whitespace.leading +
      rule.replacement(content, node, this.options) +
      whitespace.trailing
    )
  }

  /**
   * Determines the new lines between the current output and the replacement
   * @private
   * @param {String} output The current conversion output
   * @param {String} replacement The string to append to the output
   * @returns The whitespace to separate the current output and the replacement
   * @type String
   */

  function separatingNewlines (output, replacement) {
    var newlines = [
      output.match(trailingNewLinesRegExp)[0],
      replacement.match(leadingNewLinesRegExp)[0]
    ].sort();
    var maxNewlines = newlines[newlines.length - 1];
    return maxNewlines.length < 2 ? maxNewlines : '\n\n'
  }

  function join (string1, string2) {
    var separator = separatingNewlines(string1, string2);

    // Remove trailing/leading newlines and replace with separator
    string1 = string1.replace(trailingNewLinesRegExp, '');
    string2 = string2.replace(leadingNewLinesRegExp, '');

    return string1 + separator + string2
  }

  /**
   * Determines whether an input can be converted
   * @private
   * @param {String|HTMLElement} input Describe this parameter
   * @returns Describe what it returns
   * @type String|Object|Array|Boolean|Number
   */

  function canConvert (input) {
    return (
      input != null && (
        typeof input === 'string' ||
        (input.nodeType && (
          input.nodeType === 1 || input.nodeType === 9 || input.nodeType === 11
        ))
      )
    )
  }

  return TurndownService;

}());

// ==============================================================



(function () {
    'use strict';

    const CLASS_HINT = "_myhint_";
    let $curElement = null;
    let $btn = document.createElement("div");
    // ==============================================================================
    // 根据turndown文档，调整一些参数，让转化出来的markdown格式，满足自己的需要
    // https://github.com/domchristie/turndown
    // ==============================================================================
    let options = {
      headingStyle: 'atx',
      bulletListMarker: '+',
      codeBlockStyle: 'fenced',
      emDelimiter: '*'
    };
    // ==============================================================================
    let turndownService = new TurndownService(options);
    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");
            html = html.replace(/(<img.+\s?src=")(\/.+?")/gi, "$1" + document.location.origin + "$2");
            html = html.replace(/(<img.+\s?src=")(?!http)(.+?")/gi, "$1" + document.location.origin +
                         (document.location.pathname.substring(0, document.location.pathname.lastIndexOf('/'))) + "/$2");
            html = html.replace(/(<a.+?href=")(.*?)(".*?<\/a>)/gi, parseHref); //补全url链接，加上域名之类的
            let markdown = turndownService.turndown(html);
            markdown = markdown.replace(/<img.+?>/g, "");
            copyToClipboard(markdown);
        }
    }

    function parseHref(match, head, link, tail){ //对copyIt()中replace正则match到的匹配项head,link,tail，处理后返回，用于替换
        let linkFormat = '';
        var path = document.location.pathname.split('/');path.pop(); //domain
        if (link.substr(0, 4) === 'http') {
            //linkFormat = head + link.replace(/#.*/,"") + tail;  //原本的这个替换不知道，为什么非要删除url#后的部分，这里改成不删
            linkFormat = head + link + tail;
        } else if (link[0] === '#' || link.substr(0, 10) === 'javascript' || link === '"') { // "#" "javascript:" ""
            linkFormat = head + '#"' + tail;
        } else if (link[0] === '.' && link[1] === '/'){ // "./xxx"
            linkFormat = 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());
                }
            }
            linkFormat = head + document.location.origin + tmpRes.join('/') + tail;
        } else if (link.match(/^\/\/.*/)) { // //xxx.com
            linkFormat = head + document.location.protocol + link + tail;
        } else if (link.match(/^\/.*/)) { // /abc
            linkFormat = head + document.location.origin + link + tail;
        } else { // "abc/xxx"
            linkFormat = head + document.location.origin + path.join("/") + '/' + link + tail;
        }
        return linkFormat;
    }

    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();
})();
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        https://www.cnblogs.com/zhangxinqi/p/8418545.html
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Your code here...
})();