2

如何显示我的 div 清空然后附加到它的字符串表示？

 var x = $('#myDiv').outerHTML(); 
x = x.empty().append('<h1>test</h1>');


//result must look like  <div id="myDiv"><h1>test</h1></div>
4

5 回答 5

2

您需要jquery 的html()方法assign html and previous html / text if exists will be removed。

现场演示

$('#myDiv').html('<h1>test</h1>');
于 2012-11-09T10:18:10.187 回答
2

您需要将 div 添加到父级。首先创建你想要的 div：

var myDiv = $('#myDiv').empty().append("<h1>test</h1>");

将其添加到容器中：

var outerHTMLDiv = $("<div></div>").append(myDiv).html();

outerHTMLDiv 现在是

 <div id="myDiv"><h1>test</h1></div>
于 2012-11-09T11:49:34.540 回答
1

html() 方法将覆盖现有数据

$('#myDiv').html("<h1>asasas</h1>");
于 2012-11-09T10:17:36.920 回答
1

也许我完全误解了你想要什么，或者我不是完全疯了。但是，这是function我为你准备的。如果我离开了，请在下面发表评论，我将删除此答案。也就是说，这就是我认为你想要的。

还有一个jsbin。

HTML

<div id="myDiv" class="some_class">Some content already exists</div>

最终目标：想要清空内容，在它的地方想要显示它是如何写入的，html并附加一些更多的文本。您的输入是id元素的。

这是 jQuery

$(document).ready( function(){
    var id_to_change = 'myDiv';
    var content_to_add = '<h1>Test</h1>';
    show_details(id_to_change, content_to_add);
});

这是函数定义

function show_details( id, text ){
  var $el = $('#'+id);
  var lt = '&lt;';
  var gt = '&gt;';
  var tag = $el.prop('tagName').toLowerCase();

  // This is messed up, but I dunno how else to do it easily
  $el.text( text );
  var text_with_tags = $el.html();
  $el.text('');

  $el.append(lt+tag);

  var el = document.getElementById(id);  
  for (var attr, i=0, attrs=el.attributes, l=attrs.length; i<l; i++){
    attr = attrs.item(i);
    $el.append(' '+attr.nodeName+'="'+attr.nodeValue+'"');
  }

  $el.append(gt+text_with_tags+lt+tag+gt);
}

一旦函数运行， div 的实际内容将是

<div class="some_class" id="myDiv"><h1>Test</h1><div>
于 2012-11-09T11:35:01.100 回答
0

您也可以使用wrapInner()

   $("#id").empty().wrapInner('<h1>test</h1>')​​
于 2012-11-09T10:20:13.270 回答