Javascript替换img文件

Question

我正在开发一个需要使用 javascript 的网站。我需要 Javascript 才能使用外部页面。我不太明白该怎么做。我的计算机上有 5 个文件需要能够替换图像文件的名称和 alt。虽然我不能使用 http。

我有一张图片的代码:

<img src="images/cablecar.jpg" width="480" height="270" alt="cable car turnaround" id="gallery" />

我需要在使用 onmouseover 时使用 javascript 将 cablecare 和 alt 部分更改为新的图像文件和描述。 我到目前为止的代码是 Javascript:

        function switchPix(file, desc){
        var line = '<img src= asian.jpg  width=\'480\' height=\'270\' alt= +desc+/>';
        document.getElementById("pix").write(line);
        }

html:

<figure id="pix" class="right">
      <script src="scripts/gallery.js">
      </script>
      <img src="images/cablecar.jpg" width="480" height="270" alt="cable car turnaround" id="gallery" />
    </figure>
    <ul>
      <li><a href="http://www.asianart.org/" onmouseOver="switchPix(asian, Asian Market)">Asian Art Museum</a></li>

我必须使用 word 文件将 cablecar 替换为 asian，所以文件名为 asian.jpg 最后，当鼠标放在五个链接之一上时，代码假设将页面上的图像更改为另一个图像。

抱歉，如果这有点令人困惑，我自己真的很难理解它，而且我没有得到足够的信息来理解如何自己理解它。

Answer 1

您好尝试使用此代码

<figure id="pix" class="right">
      <script src="scripts/gallery.js">
      </script>          
      <img src="images/cablecar.jpg" width="480" height="270" alt="cable car turnaround" id="gallery" />
    </figure>
    <ul>
      <!-- fix onmouseover (all small case) and string parameters -->
      <li><a href="http://www.asianart.org/" onmouseover="switchPix('asian.jpg', 'Asian Market')">Asian Art Museum</a></li>

和这样的 javascript 代码可以工作

function switchPix(file, desc) {
var $elm = document.getElementById("gallery"); 
$elm.src = file;
$elm.alt = desc;
}