index.html

<head> <title>naja....</title>
<meta charset="UTF-8">
</head>


<style>
.button {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 20px 10px;
    cursor: pointer;
}


.buttonred {background-color: #f44336;} /*Red*/

</style>

<html>
<body>
<h1 id="myIntroduction">Herr Doktoro Göbel - es dauert leider immer etwas, bis ein Commit ankommt und man muss immer ein neues Inkognito Fenster aufmachen, damit Changes ankommen.
  DAs ist räudig. Lokal entwickeln geht schnellaaa!</h1>

  <h2 id="derWechselndeText"></h2>
<button class="button buttonred"> Was findet ihr denn gut ihr großen Lamas da draußen?</button>
<p>
<img src=images/a.jpg>


<!-- <script>
document.querySelector('html').onclick = function() {
    alert('Hey! Nicht so viel klicken!');
}
</script> -->
</body>


<script>
var myHeading = document.querySelector('#derWechselndeText');
var myButton = document.querySelector('button');

myHeading.onclick = function() {
  alert('Hey! Nicht so viel klicken!');
 }
function setUserName() {
  var myName = prompt('Bitte geben Sie Ihren Namen ein.');
  
  myHeading.textContent = 'Das ist richtig fett: ' + myName;
  localStorage.setItem('name', myHeading.textContent);
}

myButton.onclick = function() {
  setUserName();
}

if (localStorage.getItem('name'))
{ myHeading.textContent = localStorage.getItem('name')
      ;
    } else {
      myHeading.textContent = 'Alles ist ein bisschen scheiße......das must du ändern - geb schnell was ein, Doktor'}

</script>

<script>
var myImage = document.querySelector('img');

myImage.onclick = function() {
    var mySrc = myImage.getAttribute('src');
    if(mySrc === 'images/q.JPG') {
      myImage.setAttribute ('src','images/a.jpg');
    } else {
      myImage.setAttribute ('src','images/q.JPG');
    }
}


</script>
</html>