JavaScript修改img的src属性时图片显示找不到的问题

核心问题1：按钮选择器与事件绑定错误 #

你获取按钮元素的querySelector写法不符合规则，类选择器必须以.开头，多类名匹配时需要用.连接；同时事件绑定的语法错误，不能直接将addEventListener赋值给变量，需给获取到的元素绑定事件。

错误代码片段：

let btnNext = document.querySelector("fa-solid fa-circle-arrow-right");
let btnprevious = document.querySelector("fa-solid.fa-circle-arrow-left");
btnNext = addEventListener("click", () => { ... });

修正后：

let btnNext = document.querySelector(".fa-solid.fa-circle-arrow-right");
let btnprevious = document.querySelector(".fa-solid.fa-circle-arrow-left");
btnNext.addEventListener("click", () => { ... });

核心问题2：图片路径转义错误 #

JavaScript字符串中的\是转义字符，\r会被解析为回车符，导致实际路径变成images eview2.png，浏览器无法识别该路径。

错误代码片段：

document.getElementById("student").src = "images\review2.png";

修正方式（二选一，推荐第一种）：

// Web路径标准写法，用正斜杠
document.getElementById("student").src = "images/review2.png";
// 或用双反斜杠转义
document.getElementById("student").src = "images\\review2.png";

完整修正后的JavaScript代码 #

let btnNext = document.querySelector(".fa-solid.fa-circle-arrow-right");
let btnprevious = document.querySelector(".fa-solid.fa-circle-arrow-left");

btnNext.addEventListener("click", () => {
  document.getElementById("reviewtext").textContent =
    "Nu am reusit sa ajung la cursurile mele de algebra din cause serviciului.In orice caz,nu a fost mare pierdere deoarece Pitagora.ro m-a ajutat sa recuperez materia fara probleme";
  document.getElementById("reviewnume").textContent = "Bogdan,22";
  document.getElementById("reviewnume").style.textAlign = "center";
  document.getElementById("reviewtext").style.fontSize = "25px";
  document.getElementById("reviewtext").style.marginLeft = "20px";
  // 修正后的图片路径
  document.getElementById("student").src = "images/review2.png";
});

额外建议 #

HTML中的图片路径也建议把\改成/，避免跨平台解析问题：

<img id="student" src="images/review1.png" />

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