JavaScript Link Elment indentifizieren

F_GXdx

Captain
Dabei seit
März 2006
Beiträge
4.028
Hi,

Ich habe einen Button, mit dem ich ein Link-Element austausche. Jetzt scheint es aber mit JavaScript keine andere Möglichkeit zu geben, dieses Element auszuwählen, als mit

document.getElementsByTagName("link").item(NUMBER);

Das das nicht gut ist, ist ja klar. Gibt es wirklich keinen anderen Weg?

Hintergrund ist, dass mit dem Button die .css File getauscht wird und ich nicht so scharf drauf bin, es anders zu lösen.

kthxbai
 

Madman1209

Fleet Admiral
Dabei seit
Nov. 2010
Beiträge
24.940
Hi,

getElementByName? getElementByID? Oder mit einem Framework wie jQuery? Das sind extrem wenige und schlechte Infos. Poste mal ein bisschen Code.

Das Statement "in Javascript geht nur getElementsByTagName" ist schlicht falsch.

Überhaupt: welche CSS wird getauscht? Die der Seite selbst?

VG,
Mad
 

IMakeULoveMe

Cadet 2nd Year
Dabei seit
Mai 2013
Beiträge
23
Ich nehme an du möchtest dynamisch Style Sheets einbinden.
Warum nimmst du nicht gleich ein Anker Tag?
Kannst dieses dann in einen Button umstylen.
Amsonsten würde ich hier mit Events arbeiten wenn du die Buttons behalten willst.
 

F_GXdx

Captain
Ersteller dieses Themas
Dabei seit
März 2006
Beiträge
4.028
HTML:

Code:
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>x.de</title>
<link rel="stylesheet" href="style.css" type="text/css">
<script type='text/javascript'>
function changeCSS() {
  var oldLink = document.getElementsByTagName("link").item(0);
  var newLink = document.createElement("link");

  newLink.setAttribute("rel", "stylesheet");
  newLink.setAttribute("type", "text/css");
  newLink.setAttribute("href", "style2.css");
 
  document.getElementsByTagName("head").item(0).replaceChild(newLink, oldLink);
}
 </script>
</head>
<body >
<div onclick="javascript:changeCSS();" style="background-color:#BBB">Change Backgroundcolor</div>
</body>
</html>
style.css:
Code:
body{background-color:#FFF;}
style2.css:
Code:
body{background-color:#000;}
 
C

carom

Gast
Was genau ist nun dein Problem? Im der HTML5-Referenz steht nichts davon, dass ein link-Element kein id-Attribut haben darf (link erbt von HTMLElement), warum nicht darüber lösen?

document.getElementById('theLink').setAttribute('href', 'style2.css');

edit: würde aber auch eher Klassen austauschen als das gesamte CSS-File.
 

Daaron

Fleet Admiral
Dabei seit
Dez. 2011
Beiträge
13.487
Viel effizientere Lösung:
Leg ne zusätzliche CSS-Datei an, die verschiedene "Optiken" bereit stellt, je nachdem welche Klasse dein <body> noch hat. <body class="red"> würde dann meinetwegen ein rotes Theme aktivieren, class="blue" ein blaues etc...
Dann schnappst du dir ein JS-Framework und arbeitest mit den jeweiligen addclass/removeclass - Methoden.
 

F_GXdx

Captain
Ersteller dieses Themas
Dabei seit
März 2006
Beiträge
4.028
Top