JavaScript 实现表格单列按字母排序
2024-08-31 16:33:14
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head> <body> <p>点击按钮,表格 name 字段按字母排序:</p>
<p><button onclick="sortTable()">排序</button></p> <table border="1" id="myTable">
<tr>
<th>Name</th>
<th>Country</th>
</tr>
<tr>
<td>Berglunds snabbkop</td>
<td>Sweden</td>
</tr>
<tr>
<td>North/South</td>
<td>UK</td>
</tr> <tr>
<td>Alfreds Futterkiste</td> <td>Germany</td>
</tr>
<tr>
<td>Koniglich Essen</td>
<td>Germany</td>
</tr>
<tr>
<td>Magazzini Alimentari Riuniti</td>
<td>Italy</td>
</tr>
<tr>
<td>Paris specialites</td>
<td>France</td>
</tr>
<tr>
<td>Island Trading</td>
<td>UK</td>
</tr>
<tr>
<td>Laughing Bacchus Winecellars</td>
<td>Canada</td>
</tr>
</table>
<script>
function sortTable() {
var table, rows, sw, i, x, y, jh;
table = document.getElementById("myTable");
sw = true;
//循环是否完成
while (sw) {
//完成了就不循环了
sw = false;
//获取行
rows = table.getElementsByTagName("TR");
//循环获得每个单元格的内容
for (i = 1; i < (rows.length - 1); i++) {
//默认不交换
jh = false; x = rows[i].getElementsByTagName("TD")[0].innerHTML.toLowerCase();
y = rows[i + 1].getElementsByTagName("TD")[0].innerHTML.toLowerCase();
//比较两个单元格的内容
if (x > y) {
//如果正确肯定要交换位子
jh= true;
break;
}
}
if (jh) {
//互换一下位子
rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
sw = true;
}
}
} </script>
</body>
</html>
最新文章
- mount windows-linux文件共享
- Linux中Screen命令使用方法
- [No00002F]3步,教你如何分解需求
- SublimeText 插件
- [转载]MCU DSP ARM 嵌入式 之间的区别
- log4net配置文件设置
- JavaSE 复习_4 接口多态和内部类
- HTML5自学笔记[ 7 ]defer和async
- 判断IE8
- Android 编程下去除 ListView 上下边界蓝色或黄色阴影
- Embedded System.
- struts2中token防止重复提交表单
- [React] Using the classnames library for conditional CSS
- perl 匿名函数传参
- 字典(Tire树)
- 实现jul 日志重定向到 slf4j
- babel的使用详解
- HangFire快速入门 分布式后端作业调度框架服务
- bash array
- 纯js上传文件 很好用
热门文章
- POJ1833 &;amp; POJ3187 &;amp; POJ3785 next_permutation应用
- 给一个执行在windows 7和NAT下的VMWARE虚拟机分配固定IP
- Unity multiplayer
- FPGA设计中的电源管理(转载)
- 记一次struts2漏洞修复带来的问题
- 10.ng-class-even与ng-class-odd
- 暑假集训-WHUST 2015 Summer Contest #0.1
- WebAssembly学习(六):AssemblyScript - 限制与类型
- 利用反射实现Servlet公共类的抽取
- 【C/C++】链表的理解与使用