Dynamischer Inhalt - Austausch von Inhalten nach Benutzerinteraktion

Question

Ich beginne gerade mit JavaScript. Dies ist, was ich versuche zu tun:

Ich möchte eine Website machen, sagen wir über Fußball. Wenn ein Nutzer auf der Website landet, sieht er einen Standardtext über Fußball. Der Benutzer hat nun die Möglichkeit, 4 Tasten zu verwenden:

Taste 1: Lüfter | Knopf 2: Kein Fußballfan | Taste 3: Long | Taste 4: Kurz |

Schaltfläche 1 und 2 werden den Inhalt entsprechend ändern. Also gibt es einen Text für Nicht-Fans und einen für Fans (und einen Standard).

Schaltfläche 3 und 4 ändern die Länge des Inhalts in eine kurze oder lange Kopie des aktuellen Textes. Wenn der Benutzer also "fan" und "short" auswählt, ändert sich der Standardinhalt in die kurze Version des fächergeschriebenen Textes.

Ich hoffe ich habe es klar erklärt. Jetzt von meiner Forschung dachte ich, dass ich etwas so verwenden könnte:

document.getElementById("content").innerHTML = "I am individualized content." 

Aber ist das wirklich der Weg zu gehen? Darüber hinaus legen meine Untersuchungen nahe, dass react.js hier am besten zu verwenden ist.

Ich bin nicht auf der Suche nach einer fertigen Lösung hier. Ich würde mich freuen, wenn jemand mich mit ein wenig Hintergrundwissen in die richtige Richtung führt.

Irgendwelche Vorschläge? :) Vielen Dank.

Answer 1

Da Sie nur einen Leitfaden für die richtige Richtung wollen, haben Sie mehrere Möglichkeiten:

1. Reinen Javascript
2. Verwenden jQuery
3. Verwenden React.js
4. Andere (zum Beispiel Schräg. js)

Um Ihre Aufgabe mit einem reinen Javascript zu erfüllen, haben Sie die richtige Funktion gefunden, um Inhalt zu ändern. Jetzt müssen Sie nur noch zwei Variablen haben (zum Halten von kurzen/langen Informationen und eine weitere zum Halten von Lüfter/Nicht-Lüfter).

Mit diesen zwei Variablen können Sie leicht finden, welche Schaltflächen geklickt wurden und welchen Inhalt Sie laden, indem Sie sie mit if-Sätzen überprüfen.