js怎么设置span标签的css样式

在js中,可以给style中的属性赋值,从而实现css样式的设置 。 下面小编举例讲解js怎么设置span标签的css样式 。

js怎么设置span标签的css样式

文章插图

需要这些哦
js+html
代码编纂器:z studio 10.0
方式/
1新建一个html文件,定名为test.html,用于讲解js怎么设置span标签的css样式 。
js怎么设置span标签的css样式

文章插图

2在test.html文件内,利用span标签建立一行内容,用于测试 。
js怎么设置span标签的css样式

文章插图

3在test.html文件内,给span标签添加一个id属性,设置为myspan 。
js怎么设置span标签的css样式

文章插图

4在test.html文件内,利用button标签建立一个按钮,给button按钮绑定onclick点击事务,当按钮被点击时,执行editcss()函数 。
js怎么设置span标签的css样式

文章插图

5在js标签中,建立editcss()函数,在函数内,经由过程id获得span对象,经由过程给style中的属性赋值,实现css样式的设置 。 例如,这里设置span标签的文字颜色为红色, 文字的大小为30px 。
js怎么设置span标签的css样式

文章插图

6在浏览器打开test.html文件,查看实现的结果 。
js怎么设置span标签的css样式

文章插图
js怎么设置span标签的css样式

文章插图

总结:1【js怎么设置span标签的css样式】1、利用span标签建立一行内容,用于测试 。 2、给span标签添加一个id属性,设置为myspan 。 3、利用button标签建立一个按钮,给button按钮绑定onclick点击事务,当按钮被点击时,执行editcss()函数 。 4、在js标签中,建立editcss()函数,在函数内,经由过程id获得span对象,经由过程给style中的属性赋值,实现css样式的设置 。


以上内容就是js怎么设置span标签的css样式的内容啦,希望对你有所帮助哦!

    推荐阅读