基于下拉列表实例化新javascript

我有一个棘手的问题要解决，到目前为止我还没有找到一个好的解决办法。对不起，我是JS的新手

我有一个下拉列表，可以选择持续时间1小时、2小时等。我正在尝试根据下拉列表切换要运行的脚本。我遇到了一些问题

我的简化html如下所示

<div id="content">
  <h2>Some Stats</h2>
  <section><div id="legend"></div></section>
  <div id="chart_container">
    <div id="graph"></div>
  </div>
</div>

<!-- My graph generates above "legend", "chart_container", and "graph". time_duration is a variable that is generated by the dropdown-->
<script>
  $(document).ready(function(){
    //dropdown
    $("#DateFilter").change(function(){
       var current = $(this).find("option:selected").attr("id");
       graph = new graph("path_to_url" + current); 
       graph.render();
    });
  });
</script>

一些统计数据
$（文档）.ready（函数（）{
//下拉列表
$（“#日期过滤器”）.change（函数（）{
var current=$（this）.find（“选项：已选”）.attr（“id”）；
图形=新图形（“路径到url”+当前）；
graph.render（）；
});
});

当我尝试更改持续时间时，会生成基于新时间段的新图表，但会覆盖在当前图表的顶部

这是因为“legend”、“chart_container”和“graph”div仍然来自旧div。此外，这些图保持连续运行（使用setInterval）

---

我可以用新图形替换整个当前图形，而不用使用JQuery为每个图形使用多个div（并使用hide，show）吗？

在JQuery中，可以使用

empty（）方法
：

然后可以添加新内容

阅读更多内容：
我想您可以使用
$（'#graph'）.html（“”）清除现有的
div
graph.render（）之前的代码>-这就是你的意思吗？正是我要发布的内容：即，清除正在绘制的当前元素中的htmlto@ochi我正要说同样的话。根据目前发布的代码很难提供更好的指导。谢谢，Ochi。似乎正在使用下面的jquery替代方案。但是，它抱怨的是：uncaughttypeerror:无法读取null的属性'removeChild'。我猜
.empty（）
试图删除子节点（可能存在，也可能不存在？）。。。第一次创建图形时，此
$（“#图形”）
可能不存在，从而导致错误。您可以事先检查：
if（$（'#graph'）.size（）>0）{$（'#graph'）.empty（）}
谢谢。似乎正在工作，但是，我遇到了很多错误，例如：Uncaught TypeError:无法读取Null的属性'removeChild'，如果它是
空的
没有更多的子级，这就是为什么
removeChild
将被视为试图删除不存在的属性。因此，我想可以忽略它吗？我不知道。我必须查看代码才能知道，但是您可以查找
removeChild
的位置以及所用的内容，或者将
empty（）
方法放在
removeChild
之后。视情况而定。
$("#graph").empty();