Question

我试图通过更改图像的scr来更改箭头的方向。您可以在这里看到“ www.bsbbalulstudentilorbucuresteni.ro/index”问题。

<img id="hnav" src="img/down-arrow.svg" class="icon-hnav" onclick="myFunction()">

function myFunction() {
  var x = document.getElementById("myDIV");
  if (x.style.display === "none") {
    x.style.display = "block";
  } else {
    x.style.display = "none";
  }
  var x = document.getElementById("hnav");
  if (x.style.bottom === "5px") {
    x.style.bottom = "50px";
  } else {
    x.style.bottom = "5px";
  }
  var x = document.getElementById("hnav");
   if (x.src === "img/up-arrow.svg") {
    x.src = "img/down-arrow.svg";
  } else {
    x.src = "img/up-arrow.svg";
  }
}

Answer 1

元素的src 属性将返回完整路径：

img.src = 'foo.png';
console.log(img.src);

<img id="img">

因此，在进一步点击时，请检查完整路径：

if (x.src === "http://www.bsbbalulstudentilorbucuresteni.ro/img/up-arrow.svg") {

或改为检查src属性：

if (x.getAttribute('src') === "img/up-arrow.svg") {

img.src = 'foo.png';
console.log(img.getAttribute('src'));

<img id="img">

Answer 2

属性src与src的属性不同。所以x.src现在是"http://www.bsbbalulstudentilorbucuresteni.ro/img/down-arrow.svg"。

您可以使用x.getAttribute('src')获得所需的值。代码如下：

var x = document.getElementById("hnav");
if (x.getAttribute('src') === "img/up-arrow.svg") {
  x.src = "img/down-arrow.svg";
} else {
  x.src = "img/up-arrow.svg";
}

首次点击后Javascript停止工作

2 个答案: