close

[JavaScript HTML DOM]修改HTML元素CSS_Style，使用getElementById


說明：
取出HTML元素 document.getElementById("id 的名稱")
myId.style設定CSS Style
此範例為設定 fontWeight 及 color

fontWeight樣式設定，可調整字的粗細度。
.style.fontWeight="normal|lighter|bold|bolder|value|initial|inherit"
color樣式設定，可調整字顏色。
.style.color="color|initial|inherit"
程式：
<html>
<head>
<title>[JavaScript-基本類]修改HTML元素CSS_Style，使用getElementById</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
function myFunTest(){
var myId = document.getElementById("javaScript53_myId");
myId.style.fontWeight = 'bold';
myId.style.color = '#558E44';
}
</script>
</head>
<body>
<div id="javaScript53_myId">[JavaScript-基本類]修改HTML元素CSS_Style，使用getElementById</div>
<input type="button" value="請點擊修改HTML元素CSS的Style" onClick="myFunTest()">

</body>
</html>

圖：

 




參考：
Style fontWeight
http://www.w3schools.com/jsref/prop_style_fontweight.asp
Style color
http://www.w3schools.com/jsref/prop_style_color.asp
Style 所有的物件
http://www.w3schools.com/jsref/dom_obj_style.asp







 






 
















其它文章


arrow
arrow
    文章標籤
    javascript html DOM getelementbyid css style
    全站熱搜
    創作者介紹
    創作者 PG Levin Li 的頭像
    PG Levin Li

    程式開發學習之路

    PG Levin Li 發表在 痞客邦 留言(0) 人氣()

    E-mail轉寄