如何用Array.map从querySelector返回的NodeList提取ID数组？

问题核心是querySelectorAll返回的NodeList是类数组对象，不是原生Array，所以直接调用map会失效——它没有这个方法。下面是几种简洁的实现方式：

方法1：用Array.from转换后调用map #

把NodeList转成真正的数组，再用map提取ID：

const elementIds = Array.from(document.querySelectorAll('.your-selector')).map(el => el.id);

方法2：用展开运算符转数组 #

展开运算符同样能把类数组的NodeList转成数组，写法更简洁：

const elementIds = [...document.querySelectorAll('.your-selector')].map(el => el.id);

补充：如果不想转数组（用NodeList的forEach） #

虽然你要的是map，但提一句：部分现代浏览器的NodeList支持forEach，如果只是收集ID也可以这么写，但不如map直接：

const elementIds = [];
document.querySelectorAll('.your-selector').forEach(el => elementIds.push(el.id));

对比你原来的过程式写法，上面两种转数组+map的方式把5步压缩成了1步，完全符合现代JS的简洁风格。

内容的提问来源于stack exchange，提问作者Álvaro Franz