<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="JS代码,表格高亮,高亮效果,表格效果" />
<meta name="description" content="一个JS实现的简单的表格动态高亮显示效果，更多表格高亮,高亮效果,表格效果请访问脚本之家JS代码频道。" />
<title>一个JS实现的简单的表格动态高亮显示效果_脚本之家</title>
<link rel="stylesheet" href="resets.css" type="text/css" media="all" charset="utf-8" />
<link rel="stylesheet" href="styles.css" type="text/css" media="all" charset="utf-8" />
<title>Table Highlight Example</title>
</head>
<body>
<table id='ex1'>
<thead>
<tr class='heading'>
<td></td>
<th class='column_header'>Header 1</th>
<td class='column_header'>Header 2</td>
</tr>
</thead>
<tbody>
<tr class='row'>
<th class='row_header'>Row Heading 1</th>
<td class='row_data'>Row Data 1</td>
<td class='row_data'>Row Data 2</td>
</tr>
<tr class='row'>
<th class='row_header'>Row Heading 2</th>
<td class='row_data'>Row Data 1</td>
<td class='row_data'>Row Data 2</td>
</tr>
</tbody>
</table>
<table id='ex2'>
<thead>
<tr class='heading2'>
<td></td>
<th class='column_header'>Header 1</th>
<td class='column_header'>Header 2</td>
</tr>
</thead>
<tbody>
<tr class='row'>
<th class='row_header'>Row Heading 1</th>
<td class='row_data'>Row Data 1</td>
<td class='row_data'>Row Data 2</td>
</tr>
<tr class='row'>
<th class='row_header'>Row Heading 2</th>
<td class='row_data'>Row Data 1</td>
<td class='row_data'>Row Data 2</td>
</tr>
</tbody>
</table>
<script src='http://www.google.com/jsapi' type='text/javascript'></script>
<script type='text/javascript'>
google.load('jquery', '1.3');
</script>
<script src="jquery.tablehightlight.js" type="text/javascript" charset="utf-8"></script>
<script type='text/javascript'>
jQuery('#ex1').tablehighlight();
jQuery('#ex2').tablehighlight({'selectors':{'headings':'.heading2'}});
</script>
<div style="text-align:center;clear:both">
<p>来源：<a href="http://www.jb51.net" target="_blank"> charlesmarshall</a> 代码整理：<a href="http://www.jb51.net" target="_blank">脚本之家</a> 感谢：<a href="http://www.jb51.net" target="_blank">xinge</a></p>
<p>转载请注明出处，此代码仅供学习交流，请勿用于商业用途。</p>
</div>
</body>
</html>
一个JS实现简单的鼠标滑过表格整行或者整列动态高亮显示效果.zip
版权申诉
67 浏览量
2022-11-10
01:38:25
上传
评论
收藏 4KB ZIP 举报
一个JS实现简单的鼠标滑过表格整行或者整列动态高亮显示效果.zip （4个子文件） 
132677719255442001 
jquery.tablehightlight.js 5KB
index.html 3KB styles.css 157B resets.css 1KB资源评论
