46

This code is not working

var span = document.getElementById("span");
span.style.fontsize = "25px";
span.innerHTML = "String";


Amit
  • 21,570
  • 27
  • 74
  • 94

6 Answers6

82

JavaScript is case sensitive.

So, if you want to change the font size, you have to go:

span.style.fontSize = "25px";
ambiguousmouse
  • 1,983
  • 3
  • 22
  • 27
  • 3
    Looks like it is VS2008's bug. Intellisense providing wrong, it is providing `fontsize` but it should provide `fontSize`. "s" character of word "fontSize" should be capital. – Amit Apr 07 '11 at 20:06
  • In JavaScript Intellisense only works meh. It usually provides names, that have already been used so far. That is, if you have declared `fontsize` somewhere, you'll get `fontsize` listed. That has nothing to do with the `.style.fontSize`, however. – Otto Abnormalverbraucher Jan 09 '14 at 13:08
  • 2
    In CSS, though, the property is called `font-size'. Why does it have a different name to access the same property in javascript? – Elliot Apr 08 '15 at 18:05
  • 1
    In CSS font-size is the correct name but in javascript that would trasnlate to font minus style so everywhere in the CSS you have a dash in javascript the property would be camel cased without the dash. – Harry Chilinguerian Jul 29 '18 at 04:29
10
<span id="span">HOI</span>
<script>
   var span = document.getElementById("span");
   console.log(span);

   span.style.fontSize = "25px";
   span.innerHTML = "String";
</script>

You have two errors in your code:

  1. document.getElementById - This retrieves the element with an Id that is "span", you did not specify an id on the span-element.

  2. Capitals in Javascript - Also you forgot the capital of Size.

Iswanto San
  • 18,263
  • 13
  • 58
  • 79
Mark
  • 234
  • 1
  • 3
4

try this:

var span = document.getElementById("span");
span.style.fontSize = "25px";
span.innerHTML = "String";
Naftali
  • 144,921
  • 39
  • 244
  • 303
1

Please never do this in real projects:

document.getElementById("span").innerHTML = "String".fontsize(25);
<span id="span"></span>
tibalt
  • 15,201
  • 1
  • 29
  • 22
  • 1
    This is so awful I couldn't just pass along without upvoting. People need to know about this, specifically, not doing this! – Emile Bergeron Sep 13 '21 at 21:49
0
span.style.fontSize = "25px";

use this

Suraj Rao
  • 29,388
  • 11
  • 94
  • 103
0

I had the same problem, this was my original HTML:

<input id = "fsize" placeholder = "Font Size" type = "number">
</input>

<button id = "apfsizeid" onclick = "apfsize()"> Apply Font Size 
</button>

<textarea id = "tarea"> Your Text 
</textarea>

And this was my original JS:

function(apfsize) {
var fsize = document.getElementById("fsize").value;
var text = document.getElementById("tarea").innerHTML;
text.style.fontsize = fsize;
document.getElementById("tarea").innerHTML = text;
}

This is my new JS, and it seems to be working just fine:

function apfsize() {
var fsize = document.getElementById("fsize").value;
fsize = Number(fsize);
document.getElementById("tarea").style.fontSize = fsize + "px";
}

So for some reason, I had to add the little "px" at the very last as a string, and somehow it worked. I hope this helps :)

Rey
  • 1
  • 2