时间戳

首页 > 解决方案 > 用JS改变元素的字体大小

javascript - 用JS改变元素的字体大小

问题描述

我是 JS 新手。我的目标是使font-sizeHTML 元素的 增加作为 JS 循环中的函数。
我已经getElementById通过 ID 找到了元素，我的函数循环正常，每次循环时我都有一个变量增加，但元素仍然没有改变。

我的 JavaScript

let i = 0;
var myvar = setInterval(IconWeeder, 1500);
var element = document.getElementById("myDIV");

function bring_er_down() {
  clearInterval(myvar);
  console.log("we stopping")
}

function IconWeeder() {
  element.style.fontSize = i;
  i == i++
    console.log("i is equal to:", i)
  console.log(element)
}
<head>
  <title>Font Size</title>
</head>
<p id="myDIV">I should change size</p>
<input type="button" value="stop" onclick="bring_er_down()"></input>
<script src="icons.js"></script>

谢谢！

标签： javascripthtml

解决方案

您需要告知font-size应该使用的单位类型，例如“px”：element.style.fontSize = i + "px";

也i == i++没有做你认为的事情，它正在工作，因为i++会增加i，但你不需要比较检查==，你只需要i++;相同i += 1;

请参阅下面的工作示例：

let i = 0;
var myvar = setInterval(IconWeeder, 250);
var element = document.getElementById("myDIV");
element.style.fontSize = i + "px";

function bring_er_down() {
  clearInterval(myvar);
  console.log("we stopping")
}

function IconWeeder() {
  element.style.fontSize = i + "px";
  i++;
  console.clear()
  console.log("i is equal to:", i)
  console.log(element)
}
<p id="myDIV">I should change size</p>
<input type="button" value="stop" onclick="bring_er_down()" />

注意：input是一个自关闭标签，所以，没有</input>，它不存在，你关闭输入.../>

推荐阅读