Boy*_*ton 2 html javascript fonts
大家好,如果你觉得这个问题很愚蠢,对不起。任何人都可以帮助我如何更改打印输出的字体?他们说 .style.fontSize 但我不知道如何在该代码中使用它。任何帮助将非常感激。谢谢!
<html>
<body>
<div id="display-date">
<script language="javascript">
today = new Date();
var month = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
var day = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
var yr = today.getYear();
if(yr < 1900) yr += 1900;
document.write(today.getDate() + " " + month[today.getMonth()] + " " + yr);
</script>
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
我建议如下:
document.getElementById('display-date').style.fontSize = '2em'; // or whatever measurement.
Run Code Online (Sandbox Code Playgroud)
而且,因为我有一些时间,这里有一个函数:
function fontSizeChange(elem, factor) {
if (!elem) {
return false;
}
else {
factor = factor || 2; // 2 is the default
elem = elem.nodeType && elem.nodeType === 1 ? elem : document.getElementById(elem);
var cur = window.getComputedStyle(elem, null).fontSize,
size = parseInt(cur.replace(/\D+/g,''),10),
unit = cur.replace(/\d+/g,'');
elem.style.fontSize = (size * factor) + unit;
}
}
Run Code Online (Sandbox Code Playgroud)
像这样调用:
fontSizeChange('display-date', 3);
Run Code Online (Sandbox Code Playgroud)
或者:
fontSizeChange(document.getElementById('display-date'), 4);
Run Code Online (Sandbox Code Playgroud)
或者(如果要使用默认设置,可以省略factor参数):
fontSizeChange('display-date');
Run Code Online (Sandbox Code Playgroud)
而且,当然,您也可以缩小 thngs:
fontSizeChange('display-date',0.25);
Run Code Online (Sandbox Code Playgroud)
当然,您也可以使用 CSS:
#display-date {
font-size: 2em;
}
Run Code Online (Sandbox Code Playgroud)
允许将调整大小附加到返回元素 ( document.querySelector()/ document.getElementById()) 或 nodeList ( document.getElementsByTagName()/ document.querySelectorAll())的更新版本:
Object.prototype.resize = function (prop, factor) {
if (prop) {
factor = parseFloat(factor) || 2;
var self = this.length ? this : [this],
cur, size, unit;
for (var i = 0, len = self.length; i < len; i++) {
var cur = window.getComputedStyle(self[i],null)[prop],
size = parseFloat(cur.replace(/\D/g,'')),
unit = cur.replace(/\d+/g,'');
self[i].style[prop] = (size * factor) + unit;
}
}
return this;
};
document.getElementsByTagName('div').resize('width',3);
document.getElementById('display-date').resize('font-size', 2.5);
Run Code Online (Sandbox Code Playgroud)
Object.prototype.resize = function (prop, factor) {
if (prop) {
factor = parseFloat(factor) || 2;
var self = this.length ? this : [this],
cur, size, unit;
for (var i = 0, len = self.length; i < len; i++) {
var cur = window.getComputedStyle(self[i],null)[prop],
size = parseFloat(cur.replace(/\D/g,'')),
unit = cur.replace(/\d+/g,'');
self[i].style[prop] = (size * factor) + unit;
}
}
return this;
};
document.querySelectorAll('div').resize('height',3);
document.querySelector('#display-date').resize('font-size', 0.5);
Run Code Online (Sandbox Code Playgroud)
参考: