Jquery-如何用新内容更新div

Question

我的网页中有一个图，每当我点击图中的一个点时，我都希望用新内容更新div。通过我的功能，我设法更新了它，但当我点击一个新的点时，新的内容会添加到旧的点上，以此类推，因为我只想在我的分区中有当前的内容。

这是我的功能：

$(document).ready(function() {
    $(div_to_update).text(content);
});

}

我试着实现

$("#chart_div").click(function()
   $('#div_to_update').remove();
});

但很明显，它删除了我的div，我无法恢复它。

Answer 1

我认为，如果您想在单击某个内容时更改div中的数据，
你可以这样做：

<script>
$(document).ready(function() {
   $(".point").click(function() {
      var content = $(this).attr('value');
      $("#div-to-update").html(content);
   });
});
</script>

在页面正文中。。。

<div id='graph'>
   <div class='point' value='10'>
   <div class='point' value='100'>
   <div class='point' value='1000'>
</div>
<div id='div-to-update'>
    // when point is clicked, content here will change
</div>

Answer 2

如果要从DOM中删除匹配元素集的所有子节点，请使用empty()

$("#chart_div").click(function(){
    $("#div_to_update").empty();
});

Answer 3

如果您想删除div内部，请使用此函数

$("#div_to_update").empty();

同样.text（content）只将内容设置为text，而不是html。如果您想将其设置为html，请使用类似的.html（）函数

$("#div_to_update").html(content);