Mit Javascript Text auslesen

Joe · 25. Januar 2021

Hallo zusammen

Ich bin Anfänger in Javascript, aber habe etwas versucht zusammen zu basteln. Ich möchte eine Ausgabe aus einer Datenbank, mit der id «Gegend» durch eine Abfrage ein zweites Mal nutzen. Die erste Auslieferung dient als Bestandteil eines Links zu einem Kartenbild mit der Abfrage möchte ich noch erklärende und zur jeweiligen Karte passende Worte ausgeben. Trotz einigem Studium und diversen Versuchen: es klappt nicht, nicht einmal mehr eine Fehlermeldung ;–)

Kann mir jemand weiterhelfen? liegt es an der Syntax, oder ist sowieso alles falsch?

vielen Dank für weiterführende Tipps!

HTML

<html>
<body>

<p id="Gegend">ursern</p>

<script type="text/javascript">

function Karten_text()
{
var Ersatz
var inhalt = document.getElementById("Gegend").value;
if (inhalt == ursern){
Ersatz = "Anderer Text, der ausgegeben wird";
}
if (inhalt == reussebene){
Ersatz = "Attinghausen und andere Gemeinden";
}
if (inhalt == schaechen){
Ersatz = "Spiringen";
}
document.getElementById("Gegend").value = Ersatz;
}
</script>

</body>
</html>

Alles anzeigen

Re:Later · 25. Januar 2021

Edit: Nachtrag. Sehe eben erst, dass du das HTML-Element in deinem Code Zeile 4 ja gepostet hast. Ich lass meinen ehemaligen Post aber unverändert. Bleibt ja trotzdem richtig.

Ist nat. schwer, wenn wir nicht wissen, was z.B. das Element "Gegend" eigentlich ist. Wenn das z.B. ein Formular-Input-Feld ist, könnte das "value" korrekt sein. Wenns aber ein DIV oder P o.ä. ist, bist wahrscheinlich hier richtiger: https://www.w3schools.com/jsref/prop_html_innerhtml.asp oder (Edit: noch richtiger) hier https://developer.mozilla.org/…/Web/API/Node/textContent und ähnliche.

Die Dinger

Code

 if (inhalt == ursern){

scheinen (zumindest) auch nicht richtig. Ich nehme mal an "ursern" ist der Inhalt des Elements, also der Text der drinnen steht. Dann musst du "quoten"

Code

if (inhalt == "ursern"){

Last but not least wirst du vermutlich den ausgelesenen Wert vielleicht noch "trimmen" müssen (Leerzeichen davor und danach weg). Das hängt davon ab, wie der HTML-Code aussieht. (EDIT: So wie er bei dir in Teile 4 steht aber wohl nicht.

Joe · 25. Januar 2021

Vielen Dank für die Hinweise, habe das mal umgesetzt, leider ohne Erfolg. Ich habe zur Verdeutlichung die Namen der Variablen usw noch etwas geändert. Das Element mit der id «MARK» (vorher «Gegend») wird nicht aus einem Formular ausgelesen, sondern wird aus einer Datenbankeingabe eines Formulars, einfach ein Text. Auf der Joomlaseite erscheint im Source-Code, je nach dem ein Wort wie «BBB» oder «AAA» an dieser mit id (MARK) bezeichneten Stelle.

HTML

<html>
<head>
 <meta charset="utf-8"></head>
<body>

<div id="MARK">AAA</div>

<script type="text/javascript">

function Karten_text()
{
var Ersatz_TEXT
var inhalt = document.getElementById('MARK').textContent;
if (inhalt == "AAA"){
Ersatz = "Andermatt ist eine Gemeinde";
}
if (inhalt == "BBB"){
Ersatz = "Attinghausen am Eingang des";
}
if (inhalt == "CCC"){
Ersatz = "Spiringen ";
}
document.getElementById('MARK').textContent = Ersatz_TEXT;
}
</script>



</body>
</html>

Alles anzeigen

Re:Later · 25. Januar 2021

Code

Ersatz_TEXT

ist gar nicht mit einem String belegt bzw. leer. Der Container wird also schlicht "verschwinden"

Und natürlich fehlt die entscheidende Zeile, erst mal nach Zeile 24.

Code

Karten_text();

weil du ja eine Function definierst, sie aber nie von außerhalb aufrufst. Dann tut sich auch nix.

Elfangor93 · 26. Januar 2021

Vieles wurde ja bereits gesagt,

Das Skript hat noch einige kleine Fehler drin, weshalb es nicht gemacht hat, was es sollte. Allen voran, wurde die Funkrion, die den Text ersetzen soll gar nie ausgeführt und somit auch kein Text ersetzt.

HTML

<html>
<head>
 <meta charset="utf-8">
</head>
<body>
  <div id="MARK">AAA</div>

  <script type="text/javascript">
  function karten_text()
  {
    let ersatz_text = "";
    let inhalt = document.getElementById('MARK').innerHTML;

    if (inhalt == "AAA")
    {
      ersatz_text = "Andermatt ist eine Gemeinde";
    }
    else if (inhalt == "BBB")
    {
      ersatz_text = "Attinghausen am Eingang des";
    }
    else if (inhalt == "CCC")
    {
      ersatz_text = "Spiringen ";
    }

    document.getElementById('MARK').innerHTML = ersatz_text;
  }  
  karten_text();
  </script>
</body>
</html>

Alles anzeigen

So sollte es funktionieren...

Joe · 26. Januar 2021

Vielen Dank, jetzt klappt es ausgezeichnet und wie gewünscht!

Re:Later · 26. Januar 2021

es wird bei dir kein Problem sein, aber textContent ist zu bevorzugen vor innerHTML. 1) Wegen Performance. 2) Und innerHTML kann u.U. bei unvorsichtiger Anwendung eine Sicherheitslücke darstellen.

Man weiß ja nicht, was du noch vor hast...

Elfangor93 · 26. Januar 2021

Zitat

textContent ist zu bevorzugen vor innerHTML

Interessant. Wusste ich nicht. Wieder etwas gelernt

Joe · 26. Januar 2021

Habe es jetzt mit «textContent» ebenfalls probiert, läuft auch so ausgezeichnet.
Nochmals vielen Dank an beide!