用JavaScript实现表格过滤，设计一个Filterable Table。
应用makeAllTablesFilterable之后，每个table附加一个输入域，用户输入字符之后，table中不包含这些字符的rows将消失，仅剩下含有相应字符的rows，并且相应字符会突出显示。
效果：
filter.js:”use strict”;window.onload = tables = getAllTables();makeAllTablesFilterable(tables);};{return document.getElementsByTagName(“table”);}{node.innerHTML = node.innerHTML.replace(new RegExp(keyword,”g”),”<span>”+keyword+”</span>”);}{node.innerHTML = node.innerHTML.replace(/<span class=\”heightlight\”>/g, “”).replace(/<\/span>/g, “”);}{var tr = table.getElementsByTagName(“tr”);for (var i = 1; i < tr.length; i++) {tr[i].hidden = false;}}{var input = document.createElement(“input”);input.oninput = function() {clearHeightlight(table);showAllTr(table);//过滤词为空则直接返回if (!this.value)return;for (var i = 1; i < table.getElementsByTagName(“tr”).length; i++) {var tr = table.getElementsByTagName(“tr”)[i];//查找是否含有关键字,不含有则隐藏if ( tr.innerHTML.indexOf(this.value) == -1) {tr.hidden = true;continue;}for (var j = 0; j < tr.cells.length; j++)heightlight(tr.cells[j], this.value);}};table.parentNode.insertBefore(input,table);return table;}{for (var i = 0; i < tables.length; i++)makeFilterable(tables[i]);}html：<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>=>====>>Filterable table=>>Location>>Paris Web 2007>IBM La Defense / INSIA=>2007-12-10>>2007-04-14>>Staff=>>Latest checkin>>Richard>2007-03-27=>Daspet>>Jaballah>></html>filter.css:table, tr *{border: 1px solid gray;margin: 0;padding: 3px;border-collapse: collapse;,tr:hover {background-color: #DEDEDE;}th {text-align: left;background-color: #041A7F;color: white;font-weight: bold;padding-right:16px;}.ascend, .descend {background-color: #A4B0FC;background-position: right;background-repeat: no-repeat;}.ascend {background-image: url(“ascend.png”);}.descend {background-image: url(“descend.png”);{background-color: #38D878;color: white;border: none;padding: 0;}
，诚实是人生绝妙的法宝。虽然对人诚实，
