本文摘自PHP中文网,作者青灯夜游,侵删。
设置方法:1、使用“对象.setAttribute('style', '属性:值')”语句;2、使用“对象.style.setProperty('属性', '值')”语句;3、使用“对象.style.cssText='属性:值'”语句。
本教程操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。
方法1:使用setAttribute()
1 2 3 4 5 6 7 8 9 | <p id= "p" >hello world<p>
<button onclick= "myFunction()" >点击按钮,设置css样式</button>
<script>
function myFunction() {
document.getElementById( "p" ).setAttribute( 'style' , 'color:#FF0000' );
}
</script>
|
效果图:
方法2:使用setProperty()
1 2 3 4 5 6 7 8 9 | <p id= "p" >hello world<p>
<button onclick= "myFunction()" >点击按钮,设置css样式</button>
<script>
function myFunction() {
document.getElementById( "p" ).style.setProperty( 'font-size' , '50px' );
}
</script>
|
效果图:
阅读剩余部分
相关阅读 >>
javascript怎么隐藏显示div
javascript如何禁止文字的复制
屏蔽javascript会怎样
javascript是什么技术
javascript函数的写法有哪些
javascript数组排序方法是什么
angularjs的内存溢出怎么处理
通过示例来了解js reduce()方法的5个使用方法
原来es6 module还可以这样用!(备忘单)
如何用js求圆的面积
更多相关阅读请进入《javascript》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » js怎么设置元素css样式