我有一些html代码，例如，
<div><span style="background:yellowgreen">name:</span><span>Rose</span></div>,
我想把代码复制粘贴成富文本格式，这样可以将html代码解析成真实的DOM。
知道有jsclipBoardData、zeroClipBoard、clipBoard-polyfill，但是都存在兼容性问题。我想写一个，适用于大多数浏览器，我该怎么做？有什么想法吗？
在我看来，每个浏览器都可以解析html的代码，而我复制的东西也是写在html的，当我把它粘贴到某个地方，比如某个网站的textarea，浏览器可以解释这些东西并显示它。但是如何实现呢？提前致谢！
【问题讨论】：
标签： javascript html css clipboard
您只需将所需元素的innerHTML 设置为textarea 的值即可。
至于有一个漂亮的文本编辑器在浏览器中执行此操作。查看https://github.com/Microsoft/monaco-editor。
const buttonElement = document.getElementById("submit");
const inputElement = document.getElementById("input");
const outputElement = document.getElementById("output");
buttonElement.onclick = function() {
output.innerHTML = inputElement.value;
};
buttonElement.click();#output {
border: 1px solid black;
}<textarea id="input"><h1>test</h1></textarea>
<button id="submit">submit</button>
<div id="output">
</div>【讨论】：
您必须使用其中一种富文本编辑器。 Here你可以看到最先进的富文本编辑器。
clipboard.setData('text/plain', selection.getText());
clipboard.setData('application/officeObj’, selection.serialize());
clipboard.setData('image/bmp', draw(selection));
clipboard.setData('text/html', '<div><span style="background:yellowgreen">name:</span><span>Rose</span></div>');
这是 javascript 代码，可帮助您复制一些类型为 text/plain 、 text/html 等的文本。您将需要 text/html
您的问题是这段代码是否在所有浏览器中都兼容？对？ 正如我所见Here 这种类型的剪贴板事件在现代浏览器中是兼容的。
祝你好运。如果我的回答对你有帮助，请评价为有帮助
【讨论】：
Check if HTML snippet is valid with Javascript - 基于此，我“验证”了 html，但我不知道你是否需要，如果你想让输出正确（即使你粘贴的 html 字符串是不是 100% 正确）。如果您只希望输出正确，那么 Devan 的答案是最简单的
function tidy(html) {
var d = document.createElement('div');
d.innerHTML = html;
return d.innerHTML;
}
function print(){
//get input from textbox
var htmlInputValue = document.getElementById("htmlInput").value;
// "validate" as html
var result = tidy(htmlInputValue);
//print it
document.getElementById("result").innerHTML = result;
}
var myInput = document.getElementById("htmlInput");
myInput.addEventListener("input", print, false);#result {
font-size: 40px;
font-weight: bold
}<html>
<body>
<label for="input">Enter your html here </label>
<input class="myInput" id="htmlInput" value="">
<p id="result"/>
</body>
</html>编辑：我为粗体和大文本添加了一些 CSS #result { 字体大小：40px;字体粗细：粗体 }
【讨论】：