编写js公共函数addclass()实现改变样式<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="demo.css" />
<script src="haha.js"></script>
<title>hahahah</title>
</head>
<body>
<table>
<caption>title</caption>
<thead>
<tr>
<th>When</th>
<th>Where</th>
</tr>
</thead>
<tbody>
<tr>
<td>June 9th</td>
<td>Portland,<abbr title="Oregon">OR</abbr></td>
</tr>
<tr>
<td>June 10th</td>
<td>seattle,<abbr title="Washington">WA</abbr></td>      </tr>
<tr>
<td>June 12th</td>
<td>Sacramento,<abbr title="California">CA</abbr></td>      </tr>
</tbody>
</table>
</body>
</html>
css部分
body{
background-color:#fff;
color:#000;
}
table{
margin:auto;
fontweight默认值border:1px solid #699;
}
caption{
margin:auto;
padding:.2em;
font-size:1.2em;
font-weight:bold;
}
th{
font-weight:normal;
font-style:italic;
text-align:left;
border:1px dotted #699; background-color:#ccc; color:#000;
}
td,tr{
width:10em;
padding:.5em;
}
tr:hover{
font-size:bold;
}
.odd{
background-color:red; }
js部分
function ss(){
if(!ElementsByTagName('table')) return false;  var ElementsByTagName('table');
var odd,rows;
for(var i=0;i<tables.length;i++){
odd=false;
rows=tables[i].getElementsByTagName('tr');
for(var j=0;j<rows.length;j++){
if(odd == true){
//rows[j].style.backgroundColor="red";
addClass(rows[j],"odd");
odd=false;
}else{
odd=true;
}
}
}
}
function dd(){
if(!ElementsByTagName) return false;
var ElementsByTagName('tr');
for(var i=0;i<rows.length;i++){
rows[i].οnmοuseοver=function(){
this.style.fontWeight="bold";
}
rows[i].οnmοuseοut=function(){
this.style.fontWeight="normal";
}
}
}
//公共添加样式函数
function addClass(element,value){
if(!element.className){
element.className=value;
}else{
newClassName=element.className;        newClassName+=" ";
newClassName+=value;
element.className=newClassName    }
}
window.οnlοad=function(){
ss();
dd();

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。