# Schriftgrösse mit Javascript ändern



## coldstone28 (1. Februar 2019)

Hallo,

versuche vergebens die schriftgrösse per JavaScript ändern zu lassen, aber klappt nicht. 

Meine Javascipt habe ich wie folgt: 

```
function change_font() {
    document.getElementsByTagName('body').style.fontSize = '10px';
}
```

Meine css:


```
body {
    font-family: 'Roboto', sans-serif;
    line-height: 1.5em;
    font-size: 16px;
}
```

Müsste doch jetzt eigentlich die schriftgrösse in meinem "body" auf 10px setzen. Macht er aber nicht. 
Ist irgendwas an der Syntax vom JavaScript falsch?


----------



## Tommy57 (2. Februar 2019)

Verwendest du jQuery?
Rufst du die Funktion change_font() in deinem Script auf? 
Wann rufst du sie auf?


----------



## coldstone28 (2. Februar 2019)

Nein jQuery verwende ich nicht. 
Habe in meiner HTML folgendes stehen:


```
<a href="" onclick="change_font()"><div id="text_bigger"><small>A</small> &rarr; A</div></a>
```

wenn ich draufklicke, wird für eine sekunde die textgrösse geändert, er springt aber immer wieder zurück auf den alten Wert.


----------



## coldstone28 (2. Februar 2019)

Ok, ich habe glaube den fehler. 
Wenn ich meinen Javascript in einer einfachen div container aufrufe, funktioniert es. 
Ich glaube hier habe ich was falsch. In einer referenz ein div container ist glaube ich nicht so gut.

```
<a href="" onclick="change_font()"><div id="text_bigger"><small>A</small> &rarr; A</div></a>
```


----------



## Tommy57 (2. Februar 2019)

Naja, du verwendest einen Link. Dieser lädt die Seite neu. Deswegen siehst du den Effekt auch nur ganz kurz. Entweder verwendest du keinen Link, oder du schreibst href="#" oder schreibst onclick="change_font();return false;"


----------



## coldstone28 (2. Februar 2019)

jetzt funktioniert es wieder nicht mehr. Ich bin echt am verzweifeln. 
Was ist denn hier falsch? 

JS

```
function change_font() {
    document.getElementsByTagName('body').style.fontSize = '50px';
}
```

HTML


```
<div onclick="change_font()" class="text_size" id="text_bigger">A+</div>
```


----------



## basti1012 (3. Februar 2019)

kein wunder das es nicht geht.

probier es mal so

```
function change_font() {
    document.getElementsByTagName('body')[0].style.fontSize = '50px';
}
```

By TagName und ClassName gehöhrt eine Zahl hinter dem ('bla')[0];
By einer id (weil die nur einmal ein einen  dokument vorkommen darf)  darf keine Zahl stehen


----------



## coldstone28 (3. Februar 2019)

basti1012 hat gesagt.:


> kein wunder das es nicht geht.
> 
> probier es mal so
> 
> ...



Das habe ich auch schon versucht aber ohne erfolg. Klappt nicht


----------



## Tommy57 (3. Februar 2019)

hier funktioniert es:
Edit fiddle - JSFiddle


----------



## coldstone28 (3. Februar 2019)

Ist echt komisch. Habe es 1 zu 1 so stehen. Alle anderen Javascript funktionen in meinem dokument funktonieren auch.


----------



## Tommy57 (3. Februar 2019)

Schau doch mal in der Konsole (F12), welche Fehlermeldung er anzeigt, in dem moment, wenn du klickst.


----------



## Tommy57 (3. Februar 2019)

Oder kann man deinen Code irgendwo sehen? Dann kann ich dir genau sagen, was du falsch machst.


----------



## coldstone28 (3. Februar 2019)

Vielen dank für deine Hilfe erstmals.

Es wird mir folgende fehlermeldung wird mir angezeigt:

```
TypeError: document.getElementsByTagName(...)[0] is undefined[Weitere Informationen] ajax.js:403:5
[LIST]
[*]    change_font file:///C:/Users/*****/Desktop/Background/js/ajax.js:403
[*]    onclick file:///C:/Users/*****/Desktop/Background/index.html#staedte:1
[/LIST]
```

Werde mal die seite hochladen und poste den link gleich.


----------



## coldstone28 (3. Februar 2019)

Schwarzmeerregion

hier mal der link zur seite


----------



## Tommy57 (3. Februar 2019)

Du verwendest die falsche Funktion. Du versucht auf ein Element per ID zuzugreifen, verwendest aber die Funktion für Tag Namen. Richtig wäre folgendes:

```
document.getElementById('haupttext').style.fontSize = '50px';
```
Edit fiddle - JSFiddle


----------



## coldstone28 (3. Februar 2019)

ohhh man. Von dem ganzen code ist mir der kopf durchgebrannt. Jetzt gehts. Vielen dank.


----------

