css样式表与javascript斗嘴的题目
发布时间：2018-08-28 10:13:00 所属栏目：创业 来源：站长网
导读：题目： 当css样式表配置了某个元素的配景致后,用javascript改变它的配景致会失效,叨教列位好手,怎样办理这种斗嘴呢?假如我非要用样式表. 代码如下： htmlheadtitle/titlestyle type=text/css#tb{width:666px;border-collapse:collapse;border:1px solid #E
|
当css样式表配置了某个元素的配景致后,用javascript改变它的配景致会失效,叨教列位好手,怎样办理这种斗嘴呢?假如我非要用样式表.
css代码中是不是不该该呈现"background=Red"这样的代码啊，应该是“background:Red”，这是第一；第二，css代码中配置的是"#tb td{border:1px solid #EEE;padding:4px;background:Red}"，可是在JavaScript代码中确实对他的父容器tr的操纵，这样，为td配置的颜色虽然要包围为tr的颜色了。以是，可以有以下几种改法：  引用的内容：[www.veryhuo.com]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html><head> <title></title> <style type="text/css"> #tb{width:666px;border-collapse:collapse;border:1px solid #EEE;font-size:14px;} #tb th{background:#EEE;border-bottom:1px solid #CCC;padding:4px;} #tb tr{background:red;}<!--将配景颜色配置在tr标签中--> #tb td{border:1px solid #EEE;padding:4px;} </style></head> <body> <table id="tb"> <tr> <th>商品名称</th> <th>单价</th> <th>库存数目</th> <th>货位</th> </tr> <tr > <td>丁学最喜好的仙四豪华版-菱纱版</td> <td>139</td> <td>10000000</td> <td>A12-253</td> </tr> <tr> <td>仙四豪华版-梦璃版</td> <td>139</td> <td>10000000</td> <td>A12-254</td> </tr> <tr> <td>仙四平凡版-首发</td> <td>69</td> <td>10000000</td> <td>A12-255</td> </tr> </table> <script type="text/javascript"> var obj=document.getElementById("tb"); // var tds=obj.getElementsByTagName("td"); for(var i=0;i<obj.rows.length;i++){ obj.rows[i].onmouseover=function() { this.style.background="#0ef"; } obj.rows[i].onmouseout=function() { this.style.background="red"; } } </script> </body></html> 二、js代码中获取td,改变其颜色 Copy to Clipboard引用的内容：[www.veryhuo.com]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html><head> <title></title> <style type="text/css"> #tb{width:666px;border-collapse:collapse;border:1px solid #EEE;font-size:14px;} #tb th{background:#EEE;border-bottom:1px solid #CCC;padding:4px;} #tb td{border:1px solid #EEE;padding:4px;background:red;} </style></head> <body> <table id="tb"> <tr> <th>商品名称</th> <th>单价</th> <th>库存数目</th> <th>货位</th> </tr> <tr > <td>丁学最喜好的仙四豪华版-菱纱版</td> <td>139</td> <td>10000000</td> <td>A12-253</td> </tr> <tr> <td>仙四豪华版-梦璃版</td> <td>139</td> <td>10000000</td> <td>A12-254</td> </tr> <tr> <td>仙四平凡版-首发</td> <td>69</td> <td>10000000</td> <td>A12-255</td> </tr> </table> <script type="text/javascript"> var obj=document.getElementById("tb"); var tds=obj.getElementsByTagName("td");//获取每个td,然后改变其颜色 for(var i=0;i<tds.length;i++){ tds[i].onmouseover=function() { this.style.background="#0ef"; } tds[i].onmouseout=function() { this.style.background="red"; } } </script> </body></html> （编辑：湖南网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
题目：
答复：