Question

我正在尝试添加更改我的html的内联样式属性。为此，我克隆了一个div并将其附加到另一个div。我也试图在剥离内联样式后在textarea中显示HTML内容。这是我的代码

//Store html in temp div
$("#html_code").clone().appendTo("#temp_html");

//remove style attribute
$("div.animation-1 span.front").removeAttr('style');

//clone this and attach to textarea
var html_extracted = $("#temp_html").clone().html();
$("#show_html").text(unescape(escape(html_extracted)));

以下是#html_code：

<div id="html_code">
<!--HTML Code-->
    <div class='animation-1'>
        <span id="box" class='letter hidden'>
            <span class='back'>Android</span>
            <span class='front'>T</span>
        </span>
    </div>
</div>

以下是#temp_html：

<!--Stores cloned html to remove its style-->
<div id="temp_html"></div>

以下是#show_html：

<!-- HTML Code display -->
<div id ="html-code-area" class="codearea">
    <textarea id="show_html" cols="58" rows="20">
        HTML will be displayed here
    </textarea>        
</div>

但是当克隆被改变时，它也会改变原始。有没有办法只更改克隆而不更改原始？此外，textarea中的文本不断添加相同的代码。如何用新内容替换textarea中的所有内容？

Answer 1

我在一个小提琴中检查了你的代码， - 它与clone（）一样正常工作，除了你从两个节点中删除样式attr。您应该只选择temp html：

$("#temp_html div.animation-1 span.front").removeAttr('style');

关于替换textarea中的文本 - 在执行新副本之前需要清空#temp_html，如下所示：

$('#temp_html').empty();

#show_html中的文本总是被替换，只是#temp_html附加了几个节点。

这是新的小提琴：http://jsfiddle.net/WdTum/3/

jquery改变克隆风格改变原始风格

1 个答案: