Javascript 在Django上更新之后，如何在DOM上更新我的数据？

我的代码似乎正常工作，它更新了后端的like，并且like按钮的innerHTML在单击时发生了更改

但是，单击按钮后，如何显示喜欢的值？目前，我需要刷新页面

我试图添加。然后在获取后，我没有完全理解它，以及如何将它与我的POST方法组合在一起

谢谢你的帮助

index.js

function build_post(post){
    // create new div for each thing that needs to be shown
    current_logged_in_user = document.querySelector('#user_detail').value;
    const element = document.createElement('div');
    const post_username = document.createElement('div');
    const post_description = document.createElement('div');
    const post_date_added = document.createElement('div');
    const post_likes = document.createElement('div');
    // add the text for each div
    post_username.innerHTML = 'Username: ' + post.poster;
    post_description.innerHTML = 'Content: ' + post.description;
    post_date_added.innerHTML = 'Date: ' + post.date_added;
    post_likes.innerHTML = 'Likes: ' + post.likes;
    // append all divs to display-post
    element.appendChild(post_username);
    element.appendChild(post_description);
    element.appendChild(post_date_added);
    element.appendChild(post_likes);
    element.classList.add('element');
    post_username.addEventListener('click', function() {
        load_user_info(post.poster);
        load_user_posts(post.poster);
    });

    const like_button = document.createElement('button');
    fetch(`/like/${post.id}`)
    .then(response => response.json())
    .then(data => {
        result = data.result
        if(result == true){
          like_button.innerHTML += 'Unlike'
          element.appendChild(like_button);
        }else{
          like_button.innerHTML += 'Like'
          element.appendChild(like_button);
        }
        like_button.addEventListener('click', function() {
            if(like_button.innerHTML === 'Like'){
                like_button.innerHTML = 'Unlike'
            }else{
                like_button.innerHTML = 'Like'
            }
                like_post(post);

            });
    });
    if (current_logged_in_user == post.poster){
        const edit_button = document.createElement('button');
        const save_button = document.createElement('button');
        edit_button.innerHTML += 'Edit'
        save_button.innerHTML += 'Save'
        element.appendChild(edit_button);
        element.appendChild(save_button);
        var editableText = document.createElement('TEXTAREA');
        editableText.value = post.description
        edit_button.addEventListener('click', function() {
            post_description.replaceWith(editableText)
        });
        save_button.addEventListener('click', function() {
            console.log(editableText.value);
            fetch(`/posts/${post.id}`, {
                method: 'PUT',
                body: JSON.stringify({
                    description: editableText.value
                })
            })
             post_description.innerHTML = 'Content: ' + editableText.value;
             editableText.replaceWith(post_description)
        });
    } // edit and save buttons
document.querySelector('#show-posts').appendChild(element)
}


function like_post(post_to_like){
    fetch(`/like/${post_to_like.id}`, {
    method: 'POST'
    })

}

views.py

def like_post(request, id_of_post_to_like):
    try:
        post_to_like = NewPost.objects.get(pk=id_of_post_to_like)
    except NewPost.DoesNotExist:
        return JsonResponse({"error": "Post not found."}, status=404)
    if request.method == 'GET':
        user = request.user
        if post_to_like.likes.filter(id=user.id).exists():
            result = True
        else:
            result = False
        return JsonResponse({
            "result": result
        }, status=200)

    if request.method == "POST":
        user = request.user
        if post_to_like.likes.filter(id=user.id).exists():
            # user has already liked this post
            # remove like/user
            post_to_like.likes.remove(user)
            return HttpResponse(status=204)
        else:
            # add a new like for a post
            post_to_like.likes.add(user)
            return HttpResponse(status=204)
    else:
        return JsonResponse({
            "error": "POST request required."
        }, status=400)

url.py

urlpatterns = [
    path("", views.index, name="index"),
    path("login", views.login_view, name="login"),
    path("logout", views.logout_view, name="logout"),
    path("register", views.register, name="register"),

    # API Routes
    path("posts", views.compose_post, name="compose_post"),
    path("posts/all_posts", views.show_posts, name="show_posts"),
    path("posts/<int:post_id>", views.post, name="post"),
    path("profile/<str:profile>", views.display_profile, name="profile"),
    path("<str:profile_posts>/posts", views.display_profile_posts, name="profile_posts"),
    path("following/<str:following_user>", views.is_following, name="is_following"),
    path("follow/<str:to_follow_this_user>", views.follow, name="follow"),
    path("unfollow/<str:to_unfollow_this_user>", views.unfollow, name="unfollow"),
    path("posts/following_users_posts", views.display_following_profiles_posts, name="following_users_posts"),
    path("like/<int:id_of_post_to_like>", views.like_post, name="like_post"),
]

urlpatterns=[
路径（“，views.index，name=“index”），
路径（“login”，views.login\u view，name=“login”），
路径（“注销”，views.logout\u view，name=“logout”），
路径（“register”，views.register，name=“register”），
#API路线
路径（“posts”，views.compose\u post，name=“compose\u post”），
路径（“posts/all_posts”，views.show_posts，name=“show_posts”），
路径（“posts/”，views.post，name=“post”），
路径（“profile/”，views.display_profile，name=“profile”），
路径（“/posts”，views.display_profile_posts，name=“profile_posts”），
路径（“following/”，views.is_following，name=“is_following”），
路径（“follow/”，views.follow，name=“follow”），
路径（“unfollow/”，views.unfollow，name=“unfollow”），
路径（“posts/following\u users\u posts”，views.display\u following\u profiles\u posts，name=“following\u users\u posts”），
路径（“like/”，views.like_post，name=“like_post”），
]

您无法实现的目标是什么？您是否从服务器返回结果，即：喜欢？