Funktion in html/ <a></a> ausgeben

  • Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

DerNeuling21

Neues Mitglied
15 September 2017
20
0
1
18
#1
Hallo zusammen,

Javascript ist für mich eine neue Umgebung und deswegen suche ich aktuell noch nach den richtigen Befehlen.

Also ich habe eine Funktion im html Head Bereich und möchte, das diese Funktion im Body, dauerhaft von einem <a></a> ausgegeben wird.
Mit welchem Befehl komme ich hier ans Ziel?

Mit "document.getElementById(id) " komme ich laut meinem Wissensstand nicht wirklich ans gewünschte Ziel.


Danke für eure Hilfe.
 

basti1012

Aktives Mitglied
26 November 2017
599
52
28
37
#2
Da gibt es mehrer möglichkeiten
Jquery bei allen Links
HTML:
<a href="#">Link</a>
<script>
$('a').click(function(){
      alert('möglichkeit 1');
});</script>
Oder normales Js bei allen Links
HTML:
<a href="#">Link</a>
<script>
elements = document.querySelectorAll( 'a' );
elements.forEach( (i) => {
       i.addEventListener('click', (e) => {
              alert('Möglichkeit 2');
      });
});
</script>
oder nur bei Links die onclick="go()" haben
HTML:
<a href="#" onclick="go()">Link</a>
<script>
function go(){
    alert('möglichkeit 3');
}
</script>
Gebe auch noch andere möglichkeiten ,aber das sollte wohl erstmal reichen.

EDIT: Mit Id geht natürlich auch zb so
HTML:
<a id="linkid" href="#">Link</a>

<script>
  document.getElementById('linkid').onclick=function(){
         alert('Möglichkeit 4');
}
</script>
Denk aber dran,wenn ein <a> ein href="" enthält wird normalerweise die Seite neu geladen und deine Funktion abgebrochen,bzw erst garnicht gestertet
 
Zuletzt bearbeitet:

DerNeuling21

Neues Mitglied
15 September 2017
20
0
1
18
#4
Ok, dann ist meine Frage anscheinend falsch rüber gekommen. Ich möchte, das die Funktion beim laden der Seite automatisch ausgeführt wird. Nicht das ich erst drauf klicken muss.
 

Aaron3219

Aktives Mitglied
6 Oktober 2015
846
175
43
17
#5
Pack dein Script ans Ende des body-Tags, so wie es sich gehört. Sollte es aus irgendwelchen Gründen im Head-Bereich stehen MÜSSEN, dann:
JavaScript:
document.addEventListener("DOMContentLoaded", function(event) {
  //Funktion
});
Ich empfehle aber eigentlich die erste Methode, so ist es üblich.
 

basti1012

Aktives Mitglied
26 November 2017
599
52
28
37
#6
Das sieht man auch noch oft
HTML:
<body onload="deine_Function()">
Soll aber wohl nicht mehr aktuell sein
 

Marv

Mitglied
6 November 2010
407
8
18
Milkyway
#7
Folgender Code führt eine JavaScript Funktion auf der Seite automatisch aus:

HTML:
<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
    <script type="text/javascript">
        function doSomething() {
          console.log('I did something');
        }

        doSomething();
    </script>
  </head>
  <body>
    <a href="#"></a>
  </body>
</html>
Ist das was du möchtest?

Was meinst du dann ursprünglich mit, du möchtest, dass die Funktion, die im Head steht "im Body, dauerhaft von einem <a></a> ausgegeben wird".
Meinst du mit ausgeben = ausführen? Wenn ja, was möchtest du mit dem a Element, wenn die Funktion doch automatisch ausgeführt wird?
 

Aaron3219

Aktives Mitglied
6 Oktober 2015
846
175
43
17
#8
@Marv Da muss ich einhaken. Deine Variante funktioniert eben nicht!
http://jsfiddle.net/u2bxyn8a/1/

Wie auch, deine console.log funktioniert nur, weil du keine Elemente ansprichst.
Sprichst du aber Elemente an, wird das alles nicht mehr funktionieren. Sie sind ja schließlich noch nicht geladen worden!
Deshalb gilt:
Pack dein Script ans Ende des body-Tags, so wie es sich gehört. Sollte es aus irgendwelchen Gründen im Head-Bereich stehen MÜSSEN, dann:
JavaScript:
document.addEventListener("DOMContentLoaded", function(event) {
//Funktion
});
Ich empfehle aber eigentlich die erste Methode, so ist es üblich.