如何在JavaScript中缩短<img>元素的src属性值？

你遇到的是浏览器自动将相对路径转为绝对URL的问题，src属性会返回完整的带域名端口的地址，但可以通过以下几种方式拿到你需要的相对路径或者直接完成判断：

• 直接获取原始属性值
  浏览器的src属性会自动解析为绝对URL，但getAttribute('src')会返回你在HTML里写的原始相对路径，这是最直接的方法：

  const isTerminal = document.getElementById("terminal").getAttribute('src') === "sprites/terminal.png";
  

• 用URL对象提取路径
  如果必须使用src属性的绝对URL，可以借助原生URL对象来提取路径部分：

  const terminalEl = document.getElementById("terminal");
  const urlObj = new URL(terminalEl.src);
  // 去掉路径开头的斜杠，得到相对路径
  const relativeSrc = urlObj.pathname.slice(1);
  if (relativeSrc === "sprites/terminal.png") {
      // 执行你的游戏逻辑
  }
  

• 直接判断结尾字符串
  不需要提取路径的话，直接用endsWith方法判断完整URL是否以目标路径结尾，代码最简洁：

  if (document.getElementById("terminal").src.endsWith("sprites/terminal.png")) {
      // 你的判断逻辑
  }
  

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