Verwirrt mit JavaScript

hume1991

hume1991

Erfahrenes Mitglied
Guten Tag zusammen,

habe heute mal mit JavaScript angefangen zu lernen und habe schon meine Verständnisprobleme übergreifend auf HTML.
Was mit in den einzelnen Tutorials aufgefallen ist, sehe ich bei JavaScript dass z.B. Background-color nicht in der CSS Datei erfolgt sondern in der HTML Datei ist dies so richtig?

Weiterhin wie spreche ich html Elemente von JavaScript gesehen an? Gibt es wie HTML und PHP auch noch die Klassen oder ID's?

Wenn jemand meine Fragen beantworten könnte, wäre ich wirklich sehr dankbar.
 
Elemente per JS ansprechen
Javascript: 
// per ID
var Element = document.getElementById("ID");
// per Klasse
var Elemente = document.getElementsByClassName("Klasse");
// per Tag
var tagElemente = document.getElementsByTagName("p");
// per Name-Value
var namedElemente = document.getElementsByName("namevalue");

Background-Color ist eine Design-Aussage, ergo ist sie per se in der CSS zu finden. Nachdem die Seite aufgebaut ist, kann man natürlich programmatisch ändern. Jeden erdenklichen Wert der CSS-Eigenschaft - auch jener, die in der CSS nicht genutzt wurden.
Javascript: 
var Element = document.getElementById("ABC");
Element.style.color="red";

Übrigens bietet sich dafür jQuery an, weil es das Handling deutlich einfacher macht.

mfg chmee
 
Habe einfach mal einen kleinen Code zusammengebastelt zum testen, nun die Frage bei getElementsByName, ist da der Name z.B. vom Feld gemeint oder auf was bezieht sich dass elementsbyname?

Hier mal der Code, es wird aber keine Farbe angezeigt. Bei einer Zuteilung einer ID schon wieder.

Code: 
<!DOCTYPE html>
<html>

<head>
    <title>Test</title>

    <meta charset="ISO-8859-1">
    <meta name="description" content="">
    <meta name="author" content="">
    <meta name="keywords" content="">

    <link href="design.css" type="text/css" rel="stylesheet">
    <link href="favicon.ico" type="image/x-icon" rel="shortcut icon">
</head>

<body>



<h1>Test</h1>
<input type="text" name="Test" value="" size="20" maxlength="50" />
<input type="submit"  name="absenden" value="Absenden" />


<script type="text/javascript">

document.getElementsByName('Test').style.backgroundColor = 'red';


</script>
 
Es ist der Name des Elements gemeint. Aber da es den gleichen Namen mehrfach geben kann, musst du immer den Index (beginnt bei 0) des Element angeben.

HTML: 
<input type="text" name="textfeld" value="">

Javascript: 
document.getElementsByName("textfeld")[0].value = "Text für das Textfeld";


In deinem Fall also:

Javascript: 
document.getElementsByName('Test')[0].style.backgroundColor = 'red';
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück