下面是一个示例代码,演示了如何使用按钮更改HTML页面中的DIV元素的字体:
HTML部分:
这是一个DIV元素
JavaScript部分:
function changeFont() {
// 获取要更改字体的DIV元素
var div = document.getElementById("myDiv");
// 弹出字体选择框
var font = prompt("请选择字体:", "Arial, sans-serif");
// 更改DIV元素的字体
if (font) {
div.style.fontFamily = font;
}
}
在上面的示例中,我们首先在HTML部分创建了一个DIV元素和一个按钮。当按钮被点击时,会调用名为changeFont()
的JavaScript函数。
changeFont()
函数首先通过document.getElementById()
方法获取到ID为"myDiv"的DIV元素。然后,通过prompt()
方法弹出一个提示框,要求用户输入字体选择。用户输入的字体选择会被存储在font
变量中。
最后,如果用户选择了一个字体,div.style.fontFamily
将被设置为用户选择的字体,从而更改DIV元素的字体。
请注意,这个示例仅展示了如何更改一个DIV元素的字体。如果您想要更改多个DIV元素的字体,您可以使用类似的方法,只需要修改相应的DIV元素的ID和JavaScript代码即可。
下一篇:按钮功能