职位列表
职位详情
职位名称
公司名称:
职位描述:
任职要求:
薪资范围:
工作地点:
联系方式:
javascript
// script.js// 获取职位列表元素
const jobListings = document.getElementById('job-listings');// 获取职位详情元素
const jobDetails = document.getElementById('job-details');// 获取职位详情标题元素
const jobTitle = jobDetails.querySelector('h3');// 获取职位详情内容元素
const companyName = jobDetails.querySelector('p:nth-child(2)');
const jobDescription = jobDetails.querySelector('p:nth-child(3)');
const jobRequirements = jobDetails.querySelector('p:nth-child(4)');
const salaryRange = jobDetails.querySelector('p:nth-child(5)');
const jobLocation = jobDetails.querySelector('p:nth-child(6)');
const contactInfo = jobDetails.querySelector('p:nth-child(7)');// 获取申请按钮元素
const applyButton = jobDetails.querySelector('apply-button');// 监听职位列表元素的单击事件
jobListings.addEventListener('click', (e) => {// 获取单击的职位名称const jobName = e.target.innerText;// 根据职位名称获取职位详情数据// 这里需要与实际数据源进行对接const jobData = getJobData(jobName);// 更新职位详情内容jobTitle.innerText = jobData.name;companyName.innerText = `
公司名称:
${jobData.company}`;jobDescription.innerText = `
职位描述:
${jobData.description}`;jobRequirements.innerText = `
任职要求:
${jobData.requirements}`;salaryRange.innerText = `
薪资范围:
${jobData.salary}`;jobLocation.innerText = `
工作地点:
${jobData.location}`;contactInfo.innerText = `
联系方式:
${jobData.contact}`;// 显示职位详情jobDetails.style.display = 'block';
});// 监听申请按钮的单击事件
applyButton.addEventListener('click', () => {// 执行申请操作applyForJob();
});// 获取职位详情数据(模拟数据)
function getJobData(jobName) {switch (jobName) {case '职位名称 1':return {name: '职位名称 1',company: '公司名称 1',description: '职位描述 1',requirements: '任职要求 1',salary: '薪资范围 1',location: '工作地点 1',contact: '联系方式 1'};
case '职位名称 2':return {name: '职位名称 2',company: '公司名称 2',description: '职位描述 2',requirements: '任职要求 2',salary: '薪资范围 2',location: '工作地点 2',contact: '联系方式 2'};case '职位名称 3':return {name: '职位名称 3',company: '公司名称 3',description: '职位描述 3',requirements: '任职要求 3',salary: '薪资范围 3',location: '工作地点 3',contact: '联系方式 3'};default:return null;}
}// 执行申请操作(模拟操作)
function applyForJob() {alert('您已成功申请该职位!');
}