Html Button mit JavaScript ausführen

J

janS

Mitglied
Hallo Leute,
ich hätte da nochmal ein Anliegen, Ich habe mit Bootstrap vier Buttons erstellt und möchte diese nun nicht viermal da hinschreiben sondern mit JavaScript 4 mal ausführen lassen.
Ist das do ertsmal möglich oder ist die idee kompletter Schwachsinn?
Hier erstmal wie ich das vorher gelöst habe:
HTML: 
<button type="button" id="Test" class="btn col-xs-8 col-xs-offset-2 col-sm-4 col-sm-offset-1"><p id="xsmall1"></p></button>
        <button type="button" id="Test" class="btn col-xs-8 col-xs-offset-2 col-sm-4 col-sm-offset-2"><p id="xsmall2"></p></button>
        <button type="button" id="Test" class="btn col-xs-8 col-xs-offset-2 col-sm-4 col-sm-offset-1"><p id="xsmall3"></p></button>
        <button type="button" id="Test" class="btn col-xs-8 col-xs-offset-2 col-sm-4 col-sm-offset-2"><p id="xsmall4"></p></button>

Und jetzt wie meine Idee ist mit nur einem button:
HTML:
HTML: 
<button type="button" id="btnxs" class="btn col-xs-8 col-xs-offset-2 "></button>

JavaScript:
Java: 
for(var i = 0; i < 4; i++){
        document.getElementById('btnxs').innerHTML = "TestTestTest";
    }

Ist das so möglich oder vertue ich mich da komplett.
Danke für die Hilfe schonmal im vorraus.
MfG Jan
 
J

janS

Mitglied
Tut mir leid mit dem falschen Forum hab ich zuspät gemerkt.

Ich habe vier Buttons erstellt so wie im ersten Code. Jetzt möchte ich das ich das selbe Ergebnis nur mit anderem Code erziele und am besten mit einer Schleife in JS, so das diese Schleife jedes mal den einen erstellten Button neu aufruft und anzeigt.
 
mihe7

mihe7

Top Contributor
HTML: 
<!DOCTYPE html>
...
<body>
<div id="buttons"></div>
</body>

Javascript: 
function createButton(text) {
    var btn = document.createElement("button");
    btn.className = "btn col-xs-8 col-xs-offset-2 col-sm-4 col-sm-offset-1";
    btn.innerText = text;
    return btn;
}

function addButtons() {
    var container = document.getElementById("buttons");
    for (var i = 0; i < 4; i++) {
        container.appendChild(createButton("Test" + (i+1)));
    }
}

So ähnlich sollte das funktionieren.
 
J

janS

Mitglied
Danke für die schnelle Anwort. Ich habe selber auch noch weiter gegoogelt und auch append gefunden und mich damit probiert. Funktioniert jetzt einwandfrei.
 
Ähnliche Java Themen
  Titel Forum Antworten Datum
H0xt html übergibt an js ein wert nicht Angular, React, JQuery - Fragen zu JavaScript 18
C HTML-JAVA Angular, React, JQuery - Fragen zu JavaScript 2
FranziskaN Hilfe Los-Topf in js und html Angular, React, JQuery - Fragen zu JavaScript 18
Zeppi Webserver erweitert index.html Angular, React, JQuery - Fragen zu JavaScript 1
Aleyna_ Einbinden von js (ts) und HTML-Datei funktioniert nicht Angular, React, JQuery - Fragen zu JavaScript 16
G Variablen aus URL auslesen und in HTML darstellen Angular, React, JQuery - Fragen zu JavaScript 1
isatindersinght jquery convert html to image Angular, React, JQuery - Fragen zu JavaScript 0
T JS/HTML: User Inputs statt Predefines nehmen; onChange Events werden ignoriert Angular, React, JQuery - Fragen zu JavaScript 6
D HTML-Seite erkennt JS-File im Ordner nicht Angular, React, JQuery - Fragen zu JavaScript 4
M Mit innerHTML in eine bestimmte HTML-Datei schreiben Angular, React, JQuery - Fragen zu JavaScript 8
D Java Tool um HTML und Javascript zu analysieren Angular, React, JQuery - Fragen zu JavaScript 3
D Variable ohne HTML Tags ausgeben Angular, React, JQuery - Fragen zu JavaScript 14
F Schnellen Browser für HTML mit JS drin. Angular, React, JQuery - Fragen zu JavaScript 6
T html code per javascript einfügen Angular, React, JQuery - Fragen zu JavaScript 7
B HTML, CSS - Frame online aktualisieren Angular, React, JQuery - Fragen zu JavaScript 11
Chris81T Java <> DWR <> JavaScript/HTML Angular, React, JQuery - Fragen zu JavaScript 2
N warum kann ich kein javascript und css in mein html script einbinden Angular, React, JQuery - Fragen zu JavaScript 3
Gossi Frage zu Html (evtl. auch JavaScript?) Angular, React, JQuery - Fragen zu JavaScript 10
J Problem:Zugriff auf Ausgabefeld (HTML-Formular)) Angular, React, JQuery - Fragen zu JavaScript 3
C sort_table.js HTML-Tabelle direkt sortiert anzeigen lassen Angular, React, JQuery - Fragen zu JavaScript 5
O HTML Dropdownliste Angular, React, JQuery - Fragen zu JavaScript 3
J HTML frage mit javascript lösbar? Angular, React, JQuery - Fragen zu JavaScript 3
H Kalender mit Java(Script) in HTML Angular, React, JQuery - Fragen zu JavaScript 6
T HTML Tabelle - per JS neue Zeile Angular, React, JQuery - Fragen zu JavaScript 4
N HTML-Formular mit Java Script berechnen Angular, React, JQuery - Fragen zu JavaScript 4
S User Name an Html übergeben Angular, React, JQuery - Fragen zu JavaScript 6
A Flash-oder HTML Dateien mittels Java Kalenderscript anzeigen Angular, React, JQuery - Fragen zu JavaScript 4
G html mit java auslesen Angular, React, JQuery - Fragen zu JavaScript 6
L Dauerlaufzeile mit Fotos für html Angular, React, JQuery - Fragen zu JavaScript 2
M den Browser auffordern html-seite nachzuladen Angular, React, JQuery - Fragen zu JavaScript 3
D Java Variablen in HTML/Java abrufen Angular, React, JQuery - Fragen zu JavaScript 4
S HTML Cod in einer bestimmten stelle einfügen. Angular, React, JQuery - Fragen zu JavaScript 12
M Umwandeln von Umlauten im HTML form Angular, React, JQuery - Fragen zu JavaScript 10
W Wert aus HTML-Quelltext auslesen Angular, React, JQuery - Fragen zu JavaScript 8
C Flashfilm aus einer HTML-Seite im Fullscreen öffnen Angular, React, JQuery - Fragen zu JavaScript 2
A Java-Script mit HTML ändern Angular, React, JQuery - Fragen zu JavaScript 6
T java-html navigationsproblemchen Angular, React, JQuery - Fragen zu JavaScript 4
J html befehl in JS Angular, React, JQuery - Fragen zu JavaScript 5
S keine Ausgabe von Hallo Welt nach Button im Browser Angular, React, JQuery - Fragen zu JavaScript 6
H Funktion aufrufen ohne Button Angular, React, JQuery - Fragen zu JavaScript 14
S Adobe Button "Speichern unter" mit Feldvariablen und Pfad Angular, React, JQuery - Fragen zu JavaScript 2
P Zufallsbilder aus Array mithilfe Button neu anzeigen lassen Angular, React, JQuery - Fragen zu JavaScript 2
B JavaScript Button hinzufügen Angular, React, JQuery - Fragen zu JavaScript 2
L Textfarbe per button ändern Angular, React, JQuery - Fragen zu JavaScript 6
B Quiz Fragen in einem Array nach drücken auf einen Button abfragen Angular, React, JQuery - Fragen zu JavaScript 5
E Button disable (Uhrzeit) Angular, React, JQuery - Fragen zu JavaScript 1
K Liste mit button onclick verknüpfen Angular, React, JQuery - Fragen zu JavaScript 3
N Formularinhalt in Tabelle durch Button hinzufügen Angular, React, JQuery - Fragen zu JavaScript 4
T Ich möchte einen Button mit JavaScript ausblenden Angular, React, JQuery - Fragen zu JavaScript 5
T aktivieren und deaktivieren von radio button Angular, React, JQuery - Fragen zu JavaScript 2
G Button soll ohne php aktuelle Zeit holen Angular, React, JQuery - Fragen zu JavaScript 2
F Hilfe Button mit Javascript Angular, React, JQuery - Fragen zu JavaScript 2
A Neues Fenster aus iframe öffnen mit Klick auf Button Angular, React, JQuery - Fragen zu JavaScript 6
D Button - Strg+F Angular, React, JQuery - Fragen zu JavaScript 16
B Button grafisch darstellen Angular, React, JQuery - Fragen zu JavaScript 6
H Vor und zurück Button Angular, React, JQuery - Fragen zu JavaScript 13
D Button, der nach n Klicks Popup öffnet Angular, React, JQuery - Fragen zu JavaScript 3
A java chat button bauen? Angular, React, JQuery - Fragen zu JavaScript 7
L Automatische Button Angular, React, JQuery - Fragen zu JavaScript 4
N 1 Button 2 Links Angular, React, JQuery - Fragen zu JavaScript 5
V bbcodes per button Angular, React, JQuery - Fragen zu JavaScript 5
M fetch - API - Probleme? JavaScript Angular, React, JQuery - Fragen zu JavaScript 3
M JavaScript - Fetch Probleme Angular, React, JQuery - Fragen zu JavaScript 0
M Fetch Probleme - JavaScript? Angular, React, JQuery - Fragen zu JavaScript 1
M JavaScript Hilfe dringend (v.2) Angular, React, JQuery - Fragen zu JavaScript 1
P Cypress Test mit javascript ergibt [object Undefined] Meldung Angular, React, JQuery - Fragen zu JavaScript 0
F Javascript Problem bei mehrere ID's Angular, React, JQuery - Fragen zu JavaScript 7
B JavaScript - Array mit Objekten anhand des Object-keys sortieren Angular, React, JQuery - Fragen zu JavaScript 2
I JavaScript: Array umgekehrt von vorn auffüllen Angular, React, JQuery - Fragen zu JavaScript 7
B Kommunikation zwischen Javascript und Java? Angular, React, JQuery - Fragen zu JavaScript 7
A Problem bei Sortierung von Rechnungsnummern mit JavaScript Angular, React, JQuery - Fragen zu JavaScript 1
B Besseres Arbeitsmanagement bei Javascript Programm? Angular, React, JQuery - Fragen zu JavaScript 19
I Fehler im JavaScript? Angular, React, JQuery - Fragen zu JavaScript 2
B Rich Text Editor With Javascript Angular, React, JQuery - Fragen zu JavaScript 1
B nodeJS JavaScript Object require Angular, React, JQuery - Fragen zu JavaScript 12
Aartiyadav Annotation in Javascript and Typescript Angular, React, JQuery - Fragen zu JavaScript 2
B Javascript Tutorial für DOM Manipulationen? Angular, React, JQuery - Fragen zu JavaScript 0
Q Mit JavaScript Daten aus einer Textdatei verarbeiten Angular, React, JQuery - Fragen zu JavaScript 2
H RegExp in Javascript String Angular, React, JQuery - Fragen zu JavaScript 1
B php Datei in JavaScript öffnen Angular, React, JQuery - Fragen zu JavaScript 9
M Einkaufswagen JavaScript Angular, React, JQuery - Fragen zu JavaScript 4
Zeppi Javascript JSON in ein Array Angular, React, JQuery - Fragen zu JavaScript 1
Cellsplitter Api auslesen und in Json Datei speichen - Javascript (node js) Angular, React, JQuery - Fragen zu JavaScript 10
B DOM Baum in JavaScript document.body.childNodes[1] Angular, React, JQuery - Fragen zu JavaScript 10
Noahscript [Frage]: Wie erstelle ich eine htmlspecialchars_decode mit JavaScript? Angular, React, JQuery - Fragen zu JavaScript 1
A Javascript validateInput Angular, React, JQuery - Fragen zu JavaScript 0
Zeppi Javascript URL als Link Angular, React, JQuery - Fragen zu JavaScript 2
T Javascript x-Axis fortlaufendes Datum eintragen Angular, React, JQuery - Fragen zu JavaScript 0
P Editor- mit javascript Sonderzeichen beim schreiben vorschlagen Angular, React, JQuery - Fragen zu JavaScript 0
Jose Merchan JavaScript and SEO Angular, React, JQuery - Fragen zu JavaScript 0
A Ich habe eine frage zu JavaScript adblock detector? Wenn jemand auf OK Klick soll die Sete neu geladen werden Angular, React, JQuery - Fragen zu JavaScript 1
d.lumpi in javascript input erstellen Angular, React, JQuery - Fragen zu JavaScript 4
Martob282 Belegnummerierungsstempel mit JavaScript erstellen Angular, React, JQuery - Fragen zu JavaScript 34
N Javascript: mehrere Textfelder prüfen ob es sich um eine Zahl handelt und diese zwischen 1 und 49 liegt Angular, React, JQuery - Fragen zu JavaScript 10
S Javascript Canvas RadialGradient -> SVG Gradient Angular, React, JQuery - Fragen zu JavaScript 0
C JavaScript in Siri-Shortcuts zur Webseiten Bedienung Angular, React, JQuery - Fragen zu JavaScript 8
N TypeScript zu JavaScript Angular, React, JQuery - Fragen zu JavaScript 1
M Taste mit Javascript simulieren Angular, React, JQuery - Fragen zu JavaScript 6
B Rauch per Javascript auf Bild packen? Angular, React, JQuery - Fragen zu JavaScript 4
X Ohm Rechner in JavaScript aber was bedeutet Power? Angular, React, JQuery - Fragen zu JavaScript 103

Ähnliche Java Themen

Aktuelle Jobs

Neue Themen


Oben