Question

我目前的代码存在：

<img id="fixedScreenimg" src="img/fixedScreen.jpg" class="img-responsive" alt="">
<script>
    function pictureChange(){
        if(fixedScreenimg.src == "img/homeScreen.png"){
            document.getElementById("fixedScreenimg").src="img/fixedScreen.jpg");
        }else{
            document.getElementByID("fixedScreenimg").src="img/homeScreen.png");
        }
    }
</script>

如您所见，我试图检查元素的图像源是否与图像的给定路径匹配，如果是，则在按下按钮时更改图像的结果。但是，这似乎不起作用。

我试图使用getAttribute等。

任何指针？

感谢。

Answer 1

错误很少：

ID

Id

getElementById

两个，条件内不必要的关闭括号。

var elem = document.getElementById('fixedScreenimg'),
    btn = document.getElementById('btn');

function pictureChange() {
  if (elem.src == "img/homeScreen.png") {
    document.getElementById("fixedScreenimg").src = "img/fixedScreen.jpg";
  } else {
    document.getElementById("fixedScreenimg").src = "img/homeScreen.png";
  }
  console.log(elem.src);
}

btn.addEventListener('click', pictureChange);

<img id="fixedScreenimg" src="img/fixedScreen.jpg" class="img-responsive" alt="">
<button id='btn'>Change src</button>

Answer 2

您在行尾添加了一个括号

document.getElementById("fixedScreenimg").src="img/fixedScreen.jpg";

Answer 3

您实际上是在添加右括号)

尝试以下方法：

 function pictureChange(){

    var elem = document.getElementById("fixedScreenimg");

    if(elem.src === "img/homeScreen.png"){
        elem.src="img/fixedScreen.jpg";
    }else{
        elem.src="img/homeScreen.png";
    }
}

Answer 4

首先声明fixedScreenimg是什么，以及2个语句中的括号

<img id="fixedScreenimg" src="img/fixedScreen.jpg" class="img-responsive" alt="">
<script>
    function pictureChange(){
        var fixedScreenimg = document.getElementById("fixedScreenimg");
        if(fixedScreenimg.src == "img/homeScreen.png"){
            fixedScreenimg.src="img/fixedScreen.jpg";
        }else{
            fixedScreenimg.src="img/homeScreen.png";
        }
    }
</script>

Answer 5

如果条件

，请尝试使用单行

function pictureChange() {
  var elem = document.getElementById("fixedScreenimg");

  elem.src = (elem.src == "img/homeScreen.png") ? "img/fixedScreen.jpg" : "img/homeScreen.png";
}

<img id="fixedScreenimg" src="img/fixedScreen.jpg" class="img-responsive" alt="">

检查图像源是否等于图像

5 个答案: