html table标签鼠标移进移出背景变色


<html>
 <head>
  <title> new document title>  
  <meta http-equiv="Content-Type" content="text/html; charset=gbk"/>   
  <script type="text/javascript"> 
  
      window.onload = function(){
                  
     // 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。
        var trs = document.getElementsByTagName("tr");
        for(var tr of trs){
            tr.onmouseover = function(){
                this.style.backgroundColor = "#f2f2f2";
            }
            tr.onmouseout = function(){
                this.style.backgroundColor = "#fff";
            }
        }
	 }
  script> 
 head> 
 <body> 
	   <table border="1" width="50%" id="table">
	   <tr>
		<th>学号th>
		<th>姓名th>
		<th>操作th>
	   tr>  

	   <tr>
		<td>xh001td>
		<td>王小明td>
	   tr>

	   <tr>
		<td>xh002td>
		<td>刘小芳td>
	   tr>  

	   table>
 body>
html>

你可能感兴趣的:(HTML)