如何通过JavaScript更改字体大小？

Question

这段代码没有起作用

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

- jams

---

它是驼峰式吗？ span.style.fontSize = "25px"; - Seth

字体大小应该使用驼峰命名法，将 fontsize 转换为 fontSize。 - Kundan

Answer 1

JavaScript是大小写敏感的。

因此，如果您想更改字体大小，您必须执行以下操作：

span.style.fontSize = "25px";

- ambiguousmouse

---

看起来这是VS2008的一个bug。智能感知提供了错误的内容，它提供了fontsize，但应该提供fontSize。单词"fontSize"中的"s"字母应该大写。 - jams

在 JavaScript 中，智能感知的效果一般而言并不是很好。它通常只会提供已经使用过的名称。也就是说，如果你在某个地方声明了 fontsize，那么你会看到 fontsize 被列出来。然而这与 .style.fontSize 没有任何关系。 - Otto Abnormalverbraucher

在CSS中，该属性被称为“font-size”。为什么在JavaScript中访问相同的属性时它有不同的名称？ - Elliot

在CSS中，font-size是正确的名称，但在JavaScript中，它将被翻译为font minus style，因此在CSS中的任何地方都有一个破折号，在JavaScript中该属性将被驼峰式命名而没有破折号。 - Harry Chilinguerian

Answer 2

<span id="span">HOI</span>
<script>
   var span = document.getElementById("span");
   console.log(span);

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

你的代码中有两个错误：

1. document.getElementById - 这会检索具有Id为"span"的元素，但你没有在元素上指定id。

2. Javascript中的大小写 - 此外，你忘记了Size的大写字母。

- Mark

Answer 3

尝试这个：

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

- Naftali

Answer 4

请勿在实际项目中这样做：

请永远不要这样做：

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

<span id="span"></span>

- tibalt

---

这太糟糕了，我不能只是无动于衷地过去。人们需要知道这个，特别是不要这样做！ - Emile Bergeron

Answer 5

span.style.fontSize = "25px";

使用这个。

- Ankush Sood

Answer 6

我曾经遇到过同样的问题，这是我的原始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>

这是我的原始JS代码：

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

这是我的新JS，看起来运行得很好：

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

所以出于某种原因，我不得不将小的 "px" 添加为一个字符串，并且它奇迹般地生效了。希望这对你有所帮助 :)

- Rey