contenteditable=”true” js 实现去格式粘贴

处理 contenteditable="true" 输入框时，如果由别的地方拷贝内容过来粘贴时，经常会连带各种格式一起粘贴进来，使用 js 如何实现去格式粘贴呢？。

去格式粘贴解决方案：

实现思路：先给编辑节点绑定 onpaste 事件，在里面实现去格式，即：document.getElementById('myEditor').onpaste = function (event) {}；然后，判断如果是支持使用 var text = event.clipboardData.getData('text/plain') 获取纯文本及使用 document.execCommand('insertText', false, text); 直接把文本粘贴进去，则直接 OK；若不支持的话，则需要通过 prompt('请在这里粘贴文本', '') 提示输入框，让用户先把内容粘贴进去 prompt 输入框（自动去格式），然后创建选区 document.selection 或者 window.getSelection 把内容插入到选区。详细代码如下：

	document.getElementById('myEditor').onpaste = function (event) {
		var e = event || window.event;
		e.preventDefault();
		e = e.originalEvent || e;
		var text = e.clipboardData ? e.clipboardData.getData('text/plain') : prompt('请在这里粘贴文本', '');
		if (e.clipboardData) { // 支持直接 clipboardData，则直接 OK
			document.execCommand('insertText', false, text);
		} else { // 不支持则取用户在 prompt 提示输入框粘贴的内容（自动去格式的）
			var sel, textRange;
			try {
				document.execCommand("ms-beginUndoUnit", false, null); // 开始给 IE 增加撤回功能
			} catch (e) { }
			if (document.selection) { // IE9以下支持：document.selection 
				textRange = document.selection.createRange();
				textRange.text = text;
				textRange.collapse(false); // 取消选择
				textRange.select(); // 重新选择
			} else if (window.getSelection) { // IE9以上、Firefox、Safari、Chrome和Opera支持：window.getSelection()
				sel = window.getSelection();
				var range = sel.getRangeAt(0);
				range.deleteContents(); // 删除 range 的内容
				var textNode = document.createTextNode(text);
				range.insertNode(textNode); // 向 range 插入 text 节点
				range.selectNodeContents(textNode); // 选中 text 节点
				sel.removeAllRanges(); // 删除选区中所有的 range
				sel.addRange(range); // 向选区增加刚才处理后的 range（只含 text 节点）
			}
	
			try {
				document.execCommand("ms-endUndoUnit", false, null); // 结束给 IE 增加撤回功能
			} catch (e) { }
		}
	}

参考引用：
https://stackoverflow.com/questions/20124212/internet-explorer-alternative-to-document-execcommandinserttext-for-tex/20340618#20340618
https://www.cnblogs.com/qingqingzou-143/p/6702535.html