如何一次性移除DOM节点的多个属性？

当然有更简洁的实现方式！不用重复调用removeAttribute()，这里给你几个实用的方案：

方案1：数组遍历批量处理 #

这是最直观的写法，把要移除的属性名放进数组，用forEach循环逐个调用移除方法：

const image = document.querySelector('img.cat');
// 遍历属性数组，批量移除
['src', 'alt'].forEach(attr => image.removeAttribute(attr));

这种写法简洁易读，后续要添加更多需要移除的属性，直接在数组里追加就行，扩展性很强。

方案2：封装通用函数（推荐复用场景） #

如果你的项目里经常需要批量处理元素属性，可以封装一个通用函数，让调用更便捷：

function removeAttributes(element, ...attrs) {
  attrs.forEach(attr => element.removeAttribute(attr));
}

// 使用示例
const image = document.querySelector('img.cat');
removeAttributes(image, 'src', 'alt');
// 还能一次性传入更多属性，比如：removeAttributes(image, 'src', 'alt', 'data-id');

函数用了剩余参数...attrs，支持传入任意数量的属性名，灵活性拉满，下次再用直接调用就行。

方案3：操作attributes集合（另一种思路） #

你也可以直接操作元素的attributes集合，用removeNamedItem()方法移除属性，效果和removeAttribute()一致：

const image = document.querySelector('img.cat');
['src', 'alt'].forEach(attr => {
  image.attributes.removeNamedItem(attr);
});

不过这种写法和第一种本质逻辑差别不大，removeAttribute()内部其实也做了类似的处理，所以第一种写法在实际开发中更常用。

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