Javascript 单击仅在加载testdata页面后将数据馈送到表中 events() { this.unapproved.addEventListener('click', (e) => { console.log('i ha

单击仅在加载testdata页面后将数据馈送到表中

events() {
        this.unapproved.addEventListener('click', (e) => {
            console.log('i have been clicked');
            e.preventDefault();
            location.hash = "testdata";
            this.unapprovedPage();


        })
    }
    unapprovedPage() {
        let table = document.getElementById('table');
        const http = new FETCH;

        try {
            http.get('../includes/unapproved.inc.php')
                .then(res => {
                    //check if the response if ok
                    console.log(res);
                    let rows = '';
                    for (let i in res) {
                        rows += ` 
                   <tr>
                        <th scope="row">1</th>
                        <td>${res[i].user_user_id} </td>
                        <td>${res[i].user_user_id} </td>
                        <td>${res[i].user_user_id} </td>
                        <td>${res[i].user_user_id} </td>
                        <td>${res[i].user_user_id} </td>
                   </tr>
                   `
                    }
                    let tablebody = document.getElementById('tableBody');
                    tablebody.innerHTML = rows;
                    $(document).ready(function() {
                        $('#example').DataTable();
                    } );

                });
        } catch (error) {
            console.log(error);

        }
    }

events（）{
此.unapproved.addEventListener（'click'，（e）=>{
log（'我已被点击'）；
e、 预防默认值（）；
location.hash=“testdata”；
这是一个未经批准的页面（）；
})
}
未经批准的页（）{
let table=document.getElementById（'table'）；
consthttp=newfetch；
试一试{
http.get（“../includes/unapproved.inc.php”）
。然后（res=>{
//检查响应是否正常
控制台日志（res）；
让行=“”；
for（让我输入res）{
行+=`
1.
${res[i].user\u user\u id}
${res[i].user\u user\u id}
${res[i].user\u user\u id}
${res[i].user\u user\u id}
${res[i].user\u user\u id}
`
}
让tablebody=document.getElementById（'tablebody'）；
tablebody.innerHTML=行；
$（文档）.ready（函数（）{
$（“#示例”）.DataTable（）；
} );
});
}捕获（错误）{
console.log（错误）；
}
}

尝试声明

tablebody

而不声明

let

您可能希望为表行和数据元素提供正确的结束选项卡-已发布的代码似乎使用了两次开始标记。尝试声明

tablebody

而不声明

而不声明let

您可能希望为表行和数据元素提供正确的结束选项卡-已发布的代码似乎使用了两次开头标记。感谢您的帮助。事实上，我在发帖几分钟后就意识到了这一点。但是我仍然有另一个类似的问题，我首先使用ajax加载整个页面，然后当我尝试访问页面中加载的一些元素时，我无法使用js访问它。它是空的。我在一段时间内发布了代码，感谢它的工作。事实上，我在发帖几分钟后就意识到了这一点。但是我仍然有另一个类似的问题，我首先使用ajax加载整个页面，然后当我尝试访问页面中加载的一些元素时，我无法使用js访问它。它是空的。我在一段时间内发布代码，请不要使用此部分回答问题，因为这是用于回答问题。相反，从一开始就创建一个新问题，以便其他人可以帮助您。谢谢我记下了笔记。请不要使用此部分回答问题，因为这是答案。相反，从一开始就提出一个新问题，这样其他人可以帮助你。谢谢你，我已经记下了

container.innerHTML = `
        <table id="table" class="table">
            <thead>
                <tr>
                    <th scope="col">#</th>
                    <th scope="col">First</th>
                    <th scope="col">Last</th>
                    <th scope="col">Handle</th>
                </tr>
            </thead>
            <tbody id="tablebody">

            </tbody>
        </table>
        `;

     try {
        http.get('../includes/unapproved.inc.php')
            .then(res => {
                //check if the response if ok
                console.log(res);
                let rows = '';
                for (let i in res) {
                    rows += ` 
               <tr>
                    <td>${res[i].user_user_id} <td>
               <tr>
               `
                }
                tablebody.innerHTML = rows;
                console.log(table);

            });
    } catch (error) {
        console.log(error);

    }

pages.js:51 Uncaught (in promise) TypeError: Cannot set property 'innerHTML' of null
    at pages.js:51

import { FETCH } from "./fetch.js";

export class PAGES {
    constructor() {
        this.unapproved = document.getElementById('unapproved');
    }
    events() {
        this.unapproved.addEventListener('click', (e) => {
            e.preventDefault();
            this.unapprovedPage();

        })
    }
    unapprovedPage() {
        let container = document.getElementById('container');
        let table = document.getElementById('table');
        let tablebody = document.getElementById('tablebody');
        container.innerHTML = `
        <table id="table" class="table">
            <thead>
                <tr>
                    <th scope="col">#</th>
                    <th scope="col">First</th>
                    <th scope="col">Last</th>
                    <th scope="col">Handle</th>
                </tr>
            </thead>
            <tbody id="tablebody">

            </tbody>
        </table>
        `;

        const http = new FETCH;

        try {
            http.get('../includes/unapproved.inc.php')
                .then(res => {
                    //check if the response if ok
                    console.log(res);
                    let rows = '';
                    for (let i in res) {
                        rows += ` 
                   <tr>
                        <td>${res[i].user_user_id} <td>
                   <tr>
                   `
                    }
                    tablebody.innerHTML = rows;
                    console.log(table);

                });
        } catch (error) {
            console.log(error);

        }
    }


}

container.innerHTML = `
<table id="table" class="table">
    <thead>
        <tr>
            <th scope="col">#</th>
            <th scope="col">First</th>
            <th scope="col">Last</th>
            <th scope="col">Handle</th>
        </tr>
    </thead>
    <tbody id="tablebody">

    </tbody>
</table>
`;

let tablebody = container.querySelector('#tablebody');

Uncaught (in promise) TypeError: Cannot set property 'innerHTML' of null
at pages.js:47

events() {
        this.unapproved.addEventListener('click', (e) => {
            console.log('i have been clicked');
            e.preventDefault();
            location.hash = "testdata";
            this.unapprovedPage();


        })
    }
    unapprovedPage() {
        let table = document.getElementById('table');
        const http = new FETCH;

        try {
            http.get('../includes/unapproved.inc.php')
                .then(res => {
                    //check if the response if ok
                    console.log(res);
                    let rows = '';
                    for (let i in res) {
                        rows += ` 
                   <tr>
                        <th scope="row">1</th>
                        <td>${res[i].user_user_id} </td>
                        <td>${res[i].user_user_id} </td>
                        <td>${res[i].user_user_id} </td>
                        <td>${res[i].user_user_id} </td>
                        <td>${res[i].user_user_id} </td>
                   </tr>
                   `
                    }
                    let tablebody = document.getElementById('tableBody');
                    tablebody.innerHTML = rows;
                    $(document).ready(function() {
                        $('#example').DataTable();
                    } );

                });
        } catch (error) {
            console.log(error);

        }
    }