javascript - 重新加载部分 HTML 而不刷新页面？

Question

单击按钮图标时:

<a onclick="updateFav({{v.video_id}}, {{v.favorite}});" ><span  class="myicons {% if v.favorite == 1 %} heart_active{% else %} heart {% endif %} "></span></a>

我用它来更改我的 sql 数据库中的数据

function updateFav(video_id, favorite) {

  $.ajax({
       type: "POST",
       url: '{{baseurl}}/fav.php',
       data:{id:video_id, fav:favorite},           
  });
}

根据数据库数据(0 或 1)，心形图标将为灰色或红色。单击图标有效，刷新页面后更改可见。

如何刷新某个 html 元素？以 div 为例。

基本上:与此页面上的“星标”收藏夹按钮具有相同的效果(stackoverflow)。

Answer 1

要重新加载页面的一部分而不刷新整个页面，只需使用 ajax 请求来获取新数据并将其添加到 div 或任何您想要的元素，请参阅下面的代码作为示例:

  $.ajax({
       type: "GET",
       url: 'getnewData.php',
       success:function(response){
           $('#myElement').html(response);
       },
  });

我们在这里所做的是发出一个ajax请求，在该请求中我们从getnewData.php请求数据并放置数据(在响应变量中到达我们)，然后我们将数据放置在div 带有 id = myElement