Hinzufügen von Bildern mit javascript

Ich habe eine html-Seite, in dem es ein Bild in der Anker-tag-code ist :

<a href="www.google.com" id="x"><img src="images/test.png" /></a>

auf dem body onload-event rufe ich eine javascript-Funktion, die dynamisch ändert sich das Bild . Mein code ist:

<script type="text/javascript">
function changeImage()
{
  document.getElementById('x').innerHTML= '<img src="images/test2.png" />'; 
}
</script>

Dies gut funktioniert in firefox aber nicht in google Chrom und ie. Bitte um Hilfe..

Ist die fehlende öffnung < zu den img tag ein Tippfehler oder Ihrem code wie folgt aussieht?
es ist Typ fehlt
documeent ist auch ein Tippfehler?
ja documeent ist auch Tippfehler

InformationsquelleAutor Durga Dutt | 2011-05-03

  1. 4

    versuchen Sie dies:

    <a href="www.google.com" id="x"><img id="y" src="images/test.png" /></a>

    in js

    function changingImg(){
    document.getElementById("y").src="./images/test2.png"
}

    Getestet in Chrome und IE.

    Dann versuchen Sie dies: [in der Hoffnung, dass id <a> verfügbar ist und mindestens ein img-tag]

    var x = document.getElementById("x");
var imgs = x.getElementsByTagName("img");
imgs[0].src="./images/img02.jpg";
    ich kann nicht geben Sie id, um das Bild-tag bcoz Sie generiert dynamisch Bilder . ich bin mit joomla .

    InformationsquelleAutor Harry Joy

  2. 4

    versuchen Sie folgenden anstelle der änderung innerHTML.

    function changeImage()
{
  var parent = documeent.getElementById('x');
  parent.getElementsByTagName("img")[0].src = "newUrl";
}

    InformationsquelleAutor Anil Namde

  3. 0

    Wie andere haben darauf hingewiesen, es gibt viele Möglichkeiten, dies zu tun. Das element A ist kein Anker, es ist ein link. Und niemand wirklich nutzt XHTML im web so loszuwerden, die XML-artige syntax.

    Wenn Sie nicht über eine id für das Bild, dann überlegen Sie:

    function changeImage(id, src) {

  var image;
  var el = document.getElementById(id);

  if (el) {
    image = el.getElementsByTagName('img')[0];

    if (image) {
      image.src = src;
    }
  }
}

    Dann können Sie eine onload-listener:

    <body onload="changeImage('x', 'images/test.png');" ...>

    oder fügen Sie ein script-element nach dem link (z.B. direkt vor dem schließenden body-tag) oder eine andere Strategie für die Ausführung der Funktion nach das Bild in das Dokument.

    InformationsquelleAutor RobG

Schreibe einen Kommentar