作者:消瘦了一生 | 来源:互联网 | 2020-07-28 10:40
Javascript如何动态更改CSS页面样式?如果要在Javascript中更改页面样式,需要更改元素的样式属性,下面我们就来看看具体的实现内容。
代码如下
JavascriptChangeCssTextBox.html
背景色
前景色
说明:
单击表单上的按钮执行用Javascript编写的SetColor()函数。
function SetColor(foreColor, backColor) {
target = document.getElementById("page");
if (target != null) {
target.style.backgroundColor = document.form1.Text1.value;;
target.style.color = document.form1.Text2.value;
}
}
在SetColor函数中调用document.getElementById方法,可以从被设定为Body标签的ID中获取Body标签的Element。如果取得了Element(target!= Null),就可以将Element的style属性的background属性和color属性设置为文本框的值。
运行结果
执行HTML文件。将显示如下所示的效果。
代码如下
JavascriptChangeCssParameter.html
这是一个测试页面
啦啦啦啦
哈哈哈哈
说明:
它类似于以前的HTML文件,但从HTML文件的参数中获取颜色代码并更改前景色和背景色
运行结果:
执行HTML文件,将显示如下所示的效果。
以上就是本篇文章的全部内容了,更多相关精彩内容的学习可以移步到 第一PHP社区 的Javascript视频教程栏目!!!!
以上就是Javascript如何动态更改CSS页面样式的详细内容,更多请关注 第一PHP社区 其它相关文章!