我想減小文本字體大小，直到文本具有一定的高度（在示例中為 54 像素）。但是腳本只執行了 1 次（僅通過負載讀取高度，不再讀取）。我不能回圈這個。
https://jsfiddle.net/Nata_Hamster/zpvhow68/
$(document).ready(function() {
let fact1 = $('div');
let fact1_h = fact1.height();
let fact_fs = parseInt($('div').css('font-size'));
alert(fact_fs);
if (fact1_h > 54) {
fact_fs -= 1;
fact1.css({
'font-size': fact_fs 'px'
});
alert(fact_fs);
fact_fs = parseInt($('div').css('font-size'));
}
});div {
width: 200px;
padding-left: 20px;
padding-right: 20px;
font-size: 20px;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<div>JavaScript (JS) is a lightweight, interpreted, or just-in-time compiled programming language with first-class functions. </div>uj5u.com熱心網友回復：
您確實需要回圈，但您還需要給界面時間進行調整
$(function() {
const fact1 = $('div');
const tID = setInterval(function() {
let fact1_h = fact1.height();
let fact_fs = parseInt($('div').css('font-size'));
if (fact1_h <= 54) {
clearInterval(tID)
return
}
fact_fs -= 1;
fact1.css({
'font-size': fact_fs 'px'
});
}, 10);
})div {
width: 200px;
padding-left: 20px;
padding-right: 20px;
font-size: 20px;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<div>JavaScript (JS) is a lightweight, interpreted, or just-in-time compiled programming language with first-class functions. </div>uj5u.com熱心網友回復：
while只要給定的條件為真，您就可以使用將執行給定陳述句的陳述句。
$(document).ready(function() {
let fact1 = $('div');
let fact1_h = fact1.height();
let fact_fs = parseInt($('div').css('font-size'));
console.log('Initial font size', fact_fs);
while (fact1_h > 54) {
fact_fs -= 1;
fact1.css({
'font-size': fact_fs 'px'
});
fact1_h = fact1.height();
console.log('New Font - ', fact_fs);
console.log('New Height - ', fact1_h);
}
});div {
width: 200px;
padding-left: 20px;
padding-right: 20px;
font-size: 20px;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<div>JavaScript (JS) is a lightweight, interpreted, or just-in-time compiled programming language with first-class functions. </div>轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/348878.html
標籤：javascript 循环