JavaScript通過元素的ID和name設(shè)置樣式
1、說明
(1)根據(jù)所提供的元素的id值,返回對該元素的引用或節(jié)點
document.getElementById("tr_th")
(2)根據(jù)參數(shù)中的標(biāo)記,返回對一組元素的引用或節(jié)點
document.getElementsByTagName("td")
2、實現(xiàn)源碼
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>JavaScript通過ID和name設(shè)置樣式</title> <style type="text/css"> #tr_th,tr td{ border: 1px #CCCCCC solid; } </style> <script type="text/javascript"> /** * JavaScript通過ID和name設(shè)置樣式 */ function setFontColor() { //獲取table中的表頭ID var tabId = document.getElementById("tr_th"); //設(shè)置表頭文字顏色 tabId.style.color = "yellow"; //獲取table中的td var tabName = document.getElementsByTagName("td"); //計算出td的個數(shù) var len = tabName.length; //遍歷table中的td,并設(shè)置td中的內(nèi)容顏色 for(var i=0;i<len;i++) { tabName[i].style.color = "blue"; } } </script> </head> <body> <table cellpadding="1" cellspacing="0" style="border:1px #CCCCCC solid; width:50%; text-align:center;"> <tr id="tr_th"> <th>工號</th> <th>姓名</th> <th>年齡</th> <th>性別</th> </tr> <tr> <td>2012010101</td> <td>張三三</td> <td>23</td> <td>男</td> </tr> <tr> <td>2012010102</td> <td>柳絲絲</td> <td>20</td> <td>女</td> </tr> </table> <input type="button" value="設(shè)置顏色" onclick="setFontColor()"/> </body> </html>
3、實現(xiàn)結(jié)果
(1)初始化時
(2)單擊“設(shè)置顏色”按鈕
相關(guān)文章
bootstrap table插件的分頁與checkbox使用詳解
這篇文章主要為大家詳細(xì)介紹了bootstrap table插件的分頁與checkbox使用詳解,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-07-07在IE6下發(fā)生Internet Explorer cannot open the Internet site錯誤
最近在IE6下面時常會發(fā)生“Internet Explorer cannot open the Internet site ”錯誤。2010-06-06bootstrap學(xué)習(xí)使用(導(dǎo)航條、下拉菜單、輪播、柵格布局等)
這篇文章主要為大家詳細(xì)介紹了bootstrap框架、導(dǎo)航條、下拉菜單、輪播廣告carousel、柵格系統(tǒng)布局、標(biāo)簽頁tabs等相關(guān)資料,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-12-12JavaScript鏈?zhǔn)秸{(diào)用原理與實現(xiàn)方法詳解
這篇文章主要介紹了JavaScript鏈?zhǔn)秸{(diào)用,結(jié)合實例形式詳細(xì)分析了JavaScript鏈?zhǔn)秸{(diào)用基本原理、實現(xiàn)方法與相關(guān)操作注意事項,需要的朋友可以參考下2020-05-05alixixi runcode.asp的代碼不錯的應(yīng)用
alixixi runcode.asp的代碼不錯的應(yīng)用...2007-08-08JavaScript中獲取鼠標(biāo)位置相關(guān)屬性總結(jié)
這篇文章主要介紹了JavaScript中獲取鼠標(biāo)位置相關(guān)屬性總結(jié),本文重點在搞清楚這些屬性的區(qū)別,需要的朋友可以參考下2014-10-10