如何使用JavaScript禁用所有链接的右键点击功能

代码存在3处核心错误： #

• 方法名拼写错误：正确方法名为getElementsByTagName，你少写了末尾的s，该方法匹配多个元素所以用复数形式Elements。
• 方法返回值处理错误：getElementsByTagName返回的是类数组的HTMLCollection集合，不是单个DOM元素，无法直接调用setAttribute方法，需要遍历集合内的所有元素逐个设置属性。
• 执行时机错误：你的脚本放在<a>标签前面，脚本执行时DOM还未渲染出链接元素，会找不到目标节点导致设置失效。

修正后的可用代码： #

<a href="/">Link</a>
<script>
// 获取所有a标签的集合
const links = document.getElementsByTagName("a");
// 遍历集合逐个设置右键菜单禁用
for (let i = 0; i < links.length; i++) {
  links[i].setAttribute("oncontextmenu", "return false;");
}
</script>

也可以用更现代的事件监听写法，避免内联属性：

const links = document.getElementsByTagName("a");
for (let i = 0; i < links.length; i++) {
  links[i].addEventListener("contextmenu", e => e.preventDefault());
}

如果必须把脚本放在页面头部，可以监听DOMContentLoaded事件保证DOM渲染完成后再执行：

document.addEventListener("DOMContentLoaded", () => {
  const links = document.getElementsByTagName("a");
  for (let i = 0; i < links.length; i++) {
    links[i].addEventListener("contextmenu", e => e.preventDefault());
  }
});

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