加载json url参数代码（javascript修改）

我有这段代码，当我把它放在同一个文件中时，它可以工作，但我必须将html与javascript分开，现在我的问题是，函数如何知道#r，以便它可以将数据放在其中

 <button id="charger">GET Data</button>
    <div id="r">Click</div>

<script src="jquery.js"></script>
<script>
  $(function() {
    $('#charger').click(function() {
        $.getJSON('url', function(donnees) {
        $('#r').html('<p><b>Name</b> : ' + donnees.name + '</p>');
        $('#r').append('<p><b>Message</b> : ' + donnees.msg + '</p>');
        $('#r').append('<p><b>id</b> : ' + donnees.Type + '</p>');
      });
    });  
  });
</script>

获取数据
点击
$（函数（）{
$（“#充电器”）。单击（函数（）{
$.getJSON（'url'，函数（donnees）{
$（'#r'）.html（'Name:'+donnees.Name+'
'）；
$（“#r”）.append（“消息：”+donnees.msg+“
”）；
$（'#r'）.append（'id:'+donnees.Type+'
'）；
});
});  
});

到目前为止，我的修改是： page.html： ...

您的数据：

和js文件：

function test() {
    $('#charger').click(function() {
       $.getJSON('url', function(donnees) {
            $('#r').html('<p><b>Name</b> : ' + donnees.name + '</p>');
            $('#r').append('<p><b>Message</b> : ' + donnees.msg + '</p>');
            $('#r').append('<p><b>id</b> : ' + donnees.Type + '</p>');
      });
    });  
  }

功能测试（）{
$（“#充电器”）。单击（函数（）{
$.getJSON（'url'，函数（donnees）{
$（'#r'）.html（'Name:'+donnees.Name+'
'）；
$（“#r”）.append（“消息：”+donnees.msg+“
”）；
$（'#r'）.append（'id:'+donnees.Type+'
'）；
});
});  
}

---

在控制台中，该函数起作用，但它不向我显示数据。

这是因为

测试

函数所做的唯一事情是向

充电器

输入的

点击事件添加事件侦听器。只需将初始代码原封不动地放在单独的js文件中，就可以了。另外，确保jQuery脚本get在另一个脚本之前加载了

function test() {
    $('#charger').click(function() {
       $.getJSON('url', function(donnees) {
            $('#r').html('<p><b>Name</b> : ' + donnees.name + '</p>');
            $('#r').append('<p><b>Message</b> : ' + donnees.msg + '</p>');
            $('#r').append('<p><b>id</b> : ' + donnees.Type + '</p>');
      });
    });  
  }