时间戳

首页 > 解决方案 > remove() 在 vanilla javascript 中不起作用 - WordPress REST API

javascript - remove() 在 vanilla javascript 中不起作用 - WordPress REST API

问题描述

即使正确选择了元素（在控制台中记录“theDeletedBlock”正常返回），remove() 方法在我的 Vanilla Javascript 代码中也不起作用。

我尝试选择父母，但没有奏效。我什至尝试简单地添加一个“隐藏”类，但它也不起作用。

帖子确实被删除了，但元素没有被删除！

这是我的代码...

HTML

<div class="student-names-in-block">
</div>

<div>
    <div class="block-text-contents">
        <span class="highlight-text"></span>
        <span class="block-text"></span>
    </div>

<a class="day-time" target="_blank" href="http://te-io.local/class-description/tuesday-2000-2-2/">tuesday 20:20-21:20</a>

    <div class="block-buttons">
        <a target="_blank" class="room-button" href="https://whereby.com/topenglish">Top</a><a target="_blank" class="report-button" href="http://te-io.local/class-description/tuesday-2000-2-2/">Report</a>
    </div>
</div>
<div class="block-buttons admin-buttons">
    <a class="delete-button">Delete</a>
</div>
...

JavaScript

...

//Delete the clicked class
deleteClassDesc(classID){

    const http = new XMLHttpRequest()        

    const params = '?class-description=' + classID

    http.open("DELETE", scheduleLocalize.teSiteUrl + "/wp-json/top/v1/schedule" + params , true)
    http.setRequestHeader("Content-type", "application/x-www-form-urlencoded")
    http.setRequestHeader("X-WP-Nonce", scheduleLocalize.nonce)

    http.onreadystatechange = function(){
        if (http.readyState == 4){
            if(http.status == 200){
                console.log('Success! Class ID: '+ classID)

                const theDeletedBlock = document.querySelector(`[data-class-id='${classID}']`)
                
                //this line does not work
                theDeletedBlock.remove()

            }else if (http.status == 400) {
                console.log('Admin: There was an error 400. Please try again, or contact us.');
            }
            else {
                //something else other than 200 was returned
                console.log(`Admin: Error: Please try again, or contact us.`);
            }
        }
    }
    
    http.send();

    //alert('Delete class ID: ')
}

标签： javascriptwordpresswordpress-rest-api

解决方案

解决了！

因此，html 是从另一个 JS 文件生成的，所以似乎我是在一个父级的父级 DIV 之外生成 html 的这个特定部分，或者更具体地说，是在生成每一代子块的正确 JS 循环之外.

我不知道确切的原因，但是在生成 html 的 JS 中组织它解决了这个问题。

感谢那些回答的人！

推荐阅读