jquery的表格组件-dataTables的基本使用
warning:
这篇文章距离上次修改已过204天，其中的内容可能已经有所变动。
<!DOCTYPE html>
<html>
<head>
<title>DataTables 示例</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.25/css/jquery.dataTables.css">
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.js"></script>
</head>
<body>
<table id="example" class="display" style="width:100%">
<thead>
<tr>
<th>名称</th>
<th>邮箱</th>
<th>年龄</th>
</tr>
</thead>
<tbody>
<tr>
<td>张三</td>
<td>zhangsan@example.com</td>
<td>32</td>
</tr>
<!-- 其他行数据 -->
</tbody>
</table>
<script>
$(document).ready(function() {
$('#example').DataTable();
} );
</script>
</body>
</html>这个代码实例展示了如何在HTML页面中引入jQuery DataTables库，并初始化一个基本的表格组件。在页面加载完成后，$(document).ready()函数会被执行，并初始化DataTable，为表格添加搜索、排序和分页等功能。这是一个简单的入门示例，实际使用中可以根据需求进行功能扩展和配置调整。
评论已关闭