Bestimmte Zeile in HTML per JavaScript ändern?

Hey,

wie ihr wahrscheinlich wisst, hat man am Anfang eines jeden HTML-Dokuments

Bild zum Beitrag

den Head-Teil. Ich möchte gerne per JavaScript die mit Rot markierte Zeile ändern. Also ich möchte die Style.css per Klick auf einen Link (<a>, darin ein <i>) ändern.

Bitte schreibt einfach das Script rein, mit welchem ich dann die Zeile ganz einfach ändern kann!

PS: Ist für Darkmode, da mir das als "einfachste" Lösung erscheint.

Grüße

4 Antworten

Dory1

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

JavaScript

01.02.2020, 21:55

Gib dem <link> Element, sowie deinem A-Element jeweils eine ID

<link id="stylesheet" ...>

<a href="#" id="switch">Darkmode</a>

Jetzt kannst du per JavaScript das href-Attribut verändern:

document.getElementById("switch").addEventListener("click", function() {
  document.getElementById("stylesheet").setAttribute("href", "darkmode.css");
});

falscherSamu

Beitragsersteller

25.02.2020, 23:15

Im Nachhinein, nach etwas mehr als 25 Tagen, finde ich diese Frage von mir einfach nur schwachsinnig und irreführend, aber danke für deine Antwort, hilft wahrscheinlich einigen hier!

Dory1

26.02.2020, 19:00

@falscherSamu

Was findest du denn daran schwachsinnig? Ist doch legitim...

falscherSamu

Beitragsersteller

27.02.2020, 18:45

@Dory1

Ja, aber ich wollte einen Darkmode verwenden - dafür gibt es viele Lösungen online, jedoch war ich zu der Zeit noch zu blöd, um das Tutorial zu verstehen...

brudermusssoos

01.02.2020, 21:40

Ich würde es hiermit versuchen. (ist einfacher für dich und für den Benutzer)

https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme

Viel Erfolg :)

threadi

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

Computer, HTML, Webseite

01.02.2020, 22:10

Das mag für dich als einfache Lösung erscheinen, ist aber nicht sicher umsetzbar. Meine Empfehlung wäre, dass Du in der Style-Datei bereits alle Styleangaben hinterlegst und per Klick lediglich dem body eine Klasse gibst die den Style umschaltet. So musst Du auch nicht mehrere Style-Dateien parallel bearbeiten, was ein Nachteil deiner Lösung wäre.

Woher ich das weiß:Berufserfahrung

blonhk112

01.02.2020, 21:39

Darf ich auch den Grund erfahren um es nachvollziehen zu können?

Ich verstehe die Frage nicht so. Du verlinkts eine Style CSS Datei und willst sie mit einer <a><li></li></a> ändern aber was für ein Sinn hat das?

Woher ich das weiß:Hobby – Viele YouTube Tutorials

Ähnliche Beiträge

JS script richtig importieren?

Wenn ich meine JS Skripte in meinem HTML Dokument schreibe funktionieren die Super. Wenn ich diese dann aber in den Header Schreibe

 <script type="text/javascript" src="scripts/JavaScript.js"></script>

Dann geht alles was mit dem Script zutun hat nicht.

...zum Beitrag

Input required?

Wie kann ich mit Javascript ein Input required machen, denn bei Html kann man es ja ändern bei untersuchen

...zum Beitrag

JavaScript HTML Button?

Ich wollte einen Darkmode Button programmieren aber ich komme nicht zurück in den Light Mode.

...zum Beitrag

Javascript auslagern (HTML)?

Hallo,

wenn ich mit <script> einen Javascriptcode in HTML schreibe, geht alles, wenn ich das Script auslagere also in eine .js Datei schreibe und genau den gleichen Text wie im HTML Code dort einfüge, ohne das <script> </script>, dann geht es irgendwie nicht. Ich habe die Datei im Head so verlinkt <script src="js/button.js"></script>

Wieso geht es dann nicht mehr?

...zum Beitrag

Variable in Javascript in ein text dokument schreiben?

Hi Leute wie ihr in der Überschrift bereits seht wollte ich wissen wie man den Inhalt einer Variable in Javascript in ein Text Dokument schreiben kann welches sich in dem Ordner der HTML und Javascript datei befindet.

...zum Beitrag

Wie kann ich mit Javascript eine Zeile einer (HTML)Tabelle auslesen?

<table width="840px" height="100px" border="solid">
<tr>
<td width="270px" align="center" id="eineID">
50
</td>
<td>
<script type="text/javascript">
//auslesen der 50
</script>
</td>
</tr>
</table>

...zum Beitrag

Wie blende ich eine HTML Zeile aus, wenn eine Zahl gleich 0 ist?

Hallo,
ich möchte gerne in einem HTML Dokument eine Zahl ausblenden lassen, wenn diese auf 0 steht. Die Zahl befindet sich in einer Zeile einer Tabelle. Im Idealfall würde ich gern nicht nur die Zahl auslbenden sondern auch die ganze Zeile (siehe Foto).
Wie lässt sich das realisieren? Ich denke wohl mit einem Javascript oder ähnlichem.
Vielen Dank im Voraus.

...zum Beitrag

HTML JavaScript, PAP zu script?

Hallo, meine aufgabe ist es, diesen PAP in Javascript umzuwandeln, leider verstehe ich dies nicht so richtig, ich bleibe mit den if's und else hängen, bitte um hilfe

bitte outputs in alert(" ") oder dokument.write auf keinen fall in html inputs, und inputs in prompt

...zum Beitrag

java script html text verändern jede sekunde?

wie kann man mit javascript machen das in html jede sekunde oder jede zweite sekunde sich der text ändert

...zum Beitrag

Html Input in Javascript ausgeben?

Ich würde gerne einen HTML Input Text in Javascript ausgeben lassen.

Dazu habe ich bereits ein Script erstellt, in dem ich einer Variable den Wert des HTML Input gebe(Es geht um die Variable "VorName"), mit Hilfe von "document.getElementById". Allerdings will die Variable den Wert nicht annehmen/ändert ihn nicht.

Ich habe auch onclick angewendet

Warum funktioniert das nicht? ) :

Danke im voraus für Tipps und Hilfe

...zum Beitrag

html auslagern?

Ich bin dabei eine Internetseite zu prgrammieren.
Mein Problem ist, dass ich nicht auf jeder Seite den selben Header und so einfügen will und falls ich was ändern möchte, es nur einmal machen muss.

Ich hab schon auf mehreren seiten etwas mit PHP gefunden allerdings benutze ich html,css und js. Kann mir jemand helfen?

danke im Vorraus.

...zum Beitrag

Per Buttonklick Inhalt ändern HTML/JAVASCRIPT?

Will, dass man zwischen 2 Inhalten über ein Buttonklick wechseln kann und habe recherchiert und rausgefunden, dass es mit funktion() geht, aber wie kann ich komplette div containers umändern? Kann man dann im Header den ganzen Code reinschreiben, oder muss man das extern auf einer anderen Seite machen? Oder geht es auch anders?

...zum Beitrag

HTML, CSS, Javascript EventHandler und .innerText?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test DOM Manipulation</title>
    <script src="inner.Text.js" defer></script>
</head>
<body>

<div>
    <button id="button">click me</button>
    <input type="submit" id="Einreichen" name="Einreichen" value="Testen">
</div>

</body>
</html>
const meinBody = document.body;
const e1 = document.createElement('div');

const innerText1 = "Programmieren ";
const innerText2 = document.createElement("b");
innerText2.innerText = "3";
const innerText3 = " FTW!";

e1.append(innerText1, innerText2, innerText3);
meinBody.append(e1);

const button = document.getElementById('button');

button.addEventListener('click', () =>  {
button.innerText = "Klicken";}

Wenn ich den button klicken, warum wird dann das click me nicht durch Klicken ersetzt?
Warum wird das meinBody.append(e1); nicht ausgeführt?

MFG

...zum Beitrag

Wie kann ich mit inner HTML und Javascript einen Zeilenumbruch erstellen?

Hallo zusammen,

Ich habe mir HTML und Javascript angefangen und möchte innerhalb eines Java script script in einem Textelement Sachen ausgeben lassen. Aber wie genau kann ich einen Zeilenumbruch mit Javascript auf das Textfeld, welches ich bearbeite übertragen? Für die bearbeitung nutze ich den document.innerHTML Befehl.

Danke schonmal im Vorraus und freundliche Grüße

...zum Beitrag

Was möchtest Du wissen?

Deine Frage stellen