JS实现仅展示当前登录用户创建的职位列表数据

核心只需要加两步逻辑：

• 从页面存放登录用户ID的节点读取当前用户ID，做好空值兼容
• 遍历职位列表时新增ID匹配判断，仅渲染创建者ID和当前用户ID一致的条目

第一步：调整用户ID容器 #

默认把存放用户ID的div隐藏，避免用户ID直接裸露在页面可视区域，不影响JS读取值：

<div data-ms-member="id" hidden></div>

第二步：修改JS渲染逻辑 #

替换原来的JS代码即可，关键判断已经加了注释：

$(function() {
    // 读取当前登录用户ID，去除前后多余空格
    const currentUserId = $('[data-ms-member="id"]').text().trim();
    // 未登录状态直接终止后续渲染，可按需替换成跳登录页逻辑
    if (!currentUserId) return;

    $.getJSON('https://db-ommitted-for-privacy?tableName=JobListings&fields=company,logo,img,companyDescription,role,roleDescription,location,link,createdByUserID,dateAdded&view=AllListings', function(data) {
        $.each(data.records, function parseJSON(i, { fields: f }) {
            // 职位创建者和当前用户ID不匹配，直接跳过不渲染
            // 如果两边类型不一致（比如一个是数字一个是字符串），就改成 String(f.createdByUserID) === currentUserId
            if (f.createdByUserID !== currentUserId) return;

            const tblRow = `<tr>
                <td>
                    <div style='padding-top: 1%; padding-bottom: 1%;'>
                        <div style='border: 1px solid black;'>
                            <button class='accordionList' style='font-size: large; outline: none;'>
                                <span style='padding-top: 2.5%; padding-bottom: 3%;'>
                                    <img src='${f.logo}' height='30px'>
                                </span> &nbsp;<span style='padding-top: 3%; padding-bottom: 3%;'>&nbsp;&nbsp; 
                                    ${f.company} &nbsp; | &nbsp; ${f.role}
                                &nbsp;&nbsp; <span style='color: #2b2b2b;'><span class='iconify-inline' data-icon='eva:pin-outline' style='color: #2b2b2b;'></span> ${f.location}</span></span>
                            </button>
                            <div class='panel'>
                                <img src='img/jobBanner2.png' width='100%'>
                                <br>
                                <p style='color: #505050;'>Posted: ${f.dateCreated} &nbsp; | &nbsp; Status: ${f.status}</p>
                                <h4>About this role:</h4>
                                <p>${f.roleDescription}</p>
                                <h4>About ${f.company}:</h4>
                                <p>${f.companyDescription}</p>
                                <br>
                                <a href='pricing.html' class='button btn btn-lg btn-block btn-sm button-black' style='padding-top: 1%; padding-bottom: 1%; width: 200px;'>Apply &nbsp; <span class='iconify-inline' data-icon='bi:arrow-right-circle' data-width='15' style='color: white;'></span></a>
                                <br>
                            </div>
                        </div>
                    </div>
                </td>
            </tr>`;
            $(tblRow).appendTo("#userdata tbody");
        });
    });
});

提醒：前端过滤仅做展示层面的控制，如果涉及数据安全，必须在后端接口层也加上当前用户ID的过滤规则，否则任何人直接调用接口都能拿到全量职位数据。

内容的提问来源于stack exchange，提问作者Matt