将元素HTML附加到新附加的textarea中

Append an elements HTML into newly appended textarea

本文关键字：新附加 textarea 元素 HTML      更新时间：2023-09-26

我正在建设一个网站设计师，已经被困在一个小烦人的问题。我做了一个小例子，我想在这里完成- http://codepen.io/mikethedj4/pen/KqyaH

下面的代码在画布中抓取html，在添加查询时将其放在文本区域中，当我单击已经添加的媒体查询时，我可以看到该html。

$(".list-of-media-queries").append("<div class='list-of-media-queries-container'><a href='javascript:void(0)' class='del-media-query'><span class='fa fa-times'></span></a> <button>"+ $(".cwidth").val() +"px</button>"+ "<pre style='text-align:left; padding-top:5px; overflow:auto;'>"+ "@media all and (max-width:"+ $(".cwidth").val() +"px) { 'n'n" + $(".dadammediaquery").val() +" }</pre>" +"</div><textarea class='"+ $(".cwidth").val() +"'>"+ $(".canves").html() +"</textarea>");

当全局样式添加到div.list-of-css-selectors时，我附加以下标签Textarea, DIV, Anchor, Button和Pre。

下面是添加

内容的示例
<textarea class="custom-css-sheet hide" style="cursor:text!important; width:100%; resize:vertical; border:0; border-radius:0; min-height:200px;" placeholder="Your Custom CSS is added here"></textarea><div class="list-of-css-selectors-container"><a href="javascript:void(0)" class="del-global-css-style"><span class="fa fa-times"></span></a> <button>body</button><pre style="text-align:left; padding-top:5px; overflow:auto;">body {
  background-color: rgb(0, 224, 97);}</pre>
</div>

现在这是我要备份的又名the global/custom styles。我把所有这些都存储在div.list-of-css-selectors中，所以我更新了我的代码(如下所示)到我想要备份的地方。现在，div.list-of-css-selectors内部的代码应该进入新添加的文本框，该文本框在添加时具有媒体查询位置的类。然而，代码没有封装在文本区域中。这是我得到的结果

<textarea class="custom-css-sheet hide" style="cursor:text!important; width:100%; resize:vertical; border:0; border-radius:0; min-height:200px;" placeholder="Your Custom CSS is added here">

我不知道为什么它会有这样的反应。如果有人能帮忙的话，我将不胜感激。

$(".list-of-media-queries").append("<div class='list-of-media-queries-container'><a href='javascript:void(0)' class='del-media-query'><span class='fa fa-times'></span></a> <button>"+ $(".cwidth").val() +"px</button>"+ "<pre style='text-align:left; padding-top:5px; overflow:auto;'>"+ "@media all and (max-width:"+ $(".cwidth").val() +"px) { 'n'n" + $(".dadammediaquery").val() +" }</pre>" +"</div><textarea class='"+ $(".cwidth").val() +"'>"+ $(".list-of-css-selectors").html() +"</textarea>");

使用val()设置textarea的值

var string = "your html content";
var textarea=$('<textarea>').val( string).appendTo( containerSelector);
相关文章：