Question

我想在加载页面后更改图像。我写了一个Java Script文件，但我不知道我的错误在哪里..我也没有在控制台中出错...

JavaScript的：

function changeImage(){
    changeImage = document.getElementsByClass("carousel-indicators");
    changeImage = changeImage.getElementsByTagName("img")[0].src;

    actualImage = document.getElementsByClass("item active");
    actualImage = actualImage.getElementsByClass("img-wrapper-inner");
    actualImage.getElementsByTagName("img").src = changeImage;
}

我也用以下函数调用该函数：

<img onload="changeImage()">

问候，谢谢！

Answer 1

正如qxz所指出的，你可能正在寻找Document.getElementsByClassName方法。

此外，使用与方法名称相同的变量名称而不使用var声明新变量可能会导致意外结果。由于JavaScript在覆盖范围方面没有问题。

最后但并非最不重要的是，getElementsByClassName返回一个数组。没有一个HTMLElement。您应该从数组中检索要操作的元素。而不是试图改变数组的src字段。

因此，组合这些项目会给你一些代码：

function handleImageLoad() {
  var loadedImage = document.getElementsByClassName('loadableImage')[0].src;
  document
      .getElementsByClassName('loadState')[0]
      .innerHTML = 'Loaded image: ' + loadedImage;
}

<img class="loadableImage" src="http://lorempixel.com/200/200" onload="handleImageLoad()" />
<p class="loadState">Loading...</p>

更改图片onLoad（） - 我的失败在哪里？

1 个答案: