检查元素内部是否存在具有特定类名的子元素的方法

zpjing~.~2026-01-08 14:57

html 复制代码

const jobList = document.querySelectorAll('.js-joblist');

const jobListDataId = Array.from(jobList).map(getDataId);


function getDataId(element) {
		// 只返回有按钮的 data-msgkey 值
		const hasInfoBtnItemSelcted = element.querySelector('.info-btn-item-selcted') !== null;
		return hasInfoBtnItemSelcted ? element.getAttribute('data-msgkey') : null;
	}

代码用途总结

这段代码的主要功能是从网页中筛选带有特定标记的工作列表项，并提取它们的data-msgkey属性值。

代码逻辑解析

const jobList = document.querySelectorAll('.js-joblist');

选取所有类名为js-joblist的DOM元素，返回一个NodeList对象。

const jobListDataId = Array.from(jobList).map(getDataId);

将NodeList转换为数组，并对每个元素调用getDataId函数进行处理。

function getDataId(element)

定义的处理函数，检查元素是否包含.info-btn-item-selcted子元素。

若存在则返回元素的data-msgkey属性值，否则返回null。

最终结果

最终得到的jobListDataId是一个数组，包含所有符合条件（有.info-btn-item-selcted子元素）的.js-joblist元素的data-msgkey值，不符合条件的元素对应位置为null。