Wie Text + Bilder auf Javascript Schaltfläche hinzufügen

Question

ich ein Bild hinzugefügt haben, aber jetzt möchte ich auch Text sowie das Image der Überschrift „Responsive“

Block

<script> 
function pic1() 
    { 
     document.getElementById("img").src = "../raining.gif"; 
     ducument.getElementById("text").innerHTML = "<h2> Responsive </h2>"; 
    } 
function pic2() 
    { 
     document.getElementById("img").src ="../movingpiston.gif"; 
    } 
    </script> 

<img src = "" id = "img"/> 
<input type="button" value="Responsive" onclick="pic1()"/> 
<input type="button" value="Reconfiguration" onclick="pic2()"/> 

Answer 1

Sie haben einen Tippfehler auf "ducument.getElementById" und Sie haben kein Element mit "Text", wie id. Ändern Sie Zeile 5 bis document.getElementById("text").innerHTML = "<h2> Responsive </h2>"; und so etwas wie <div id="text"></div> irgendwo in Ihrem HTML-Teil

Answer 2

Verschieben Skript hinzuzufügen unten, sollte es zuletzt bearbeitet werden, da einige Referenzen, die es zu erreichen versucht, nicht existieren.

Answer 3

in document.getElementById ("Text"), wo die ID "Text"? Möchten Sie einen Titel hinzufügen, um anzuzeigen, dass der Titel angezeigt wird, wenn Sie auf dem Bild schweben.

Text ist nicht vorhanden, wenn Sie einen Text anzeigen möchten, müssen Sie ein neues Element erstellen.

 var img = document.getElementById("img"); 
 
     img.setAttribute("src","../raining.gif") 
 
     var title = document.createElement("h2"); 
 
     title.innerHTML = "Responsive"; 
 
     img.parentNode.appendChild(title);