javascript - 将 Div 内容复制到 Textarea 或具有相同 font-family 样式的文本

Question

我有一些复制 <div> 的代码内容为<textarea> ，但它不会复制 <div> 的样式(字体系列) 。它以正常字体粘贴。我该如何解决这个问题？

HTML

<input type="text" id="styledText" placeholder="Place your Name..." size="50" name="styledText" class="changeMe">
<div id="fontselect" class="changeMe" onClick="copyText()" style="font-family: Times New Roman;font-size: 22px; font-weight: bold; cursor:pointer;">Place your Name...</div>

Javascript

function copyText() {
    var output = document.getElementById("fontselect").innerHTML;
    document.getElementById("styledText").value = output;
}

提前致谢:)

Answer 1

请记住，font-family 将应用于所有插入的文本，因此任何单独样式的单词/内容都将失去其差异性:

function copyText() {
    var output = document.getElementById("fontselect"),
        textElem = document.getElementById("styledText");
    textElem.value = output.value;
    textElem.style.fontFamily = window.getComputedStyle(output,null).fontFamily || output.style.fontFamily || output.currentStyle.getCurrentProperty('font-family');

}