JS怎么用关键字来过滤表格

JavaScript023

JS怎么用关键字来过滤表格,第1张

<!DOCTYPE html>

<html>

  <head>

<meta http-equiv="Content-Type" content="text/html charset=UTF-8">

<title>RunJS 演示代码</title>

<script>

var chazhao = function (){

var trs = tab1.tBodies[0].rows

for(var i = 0 i < trs.length i++){

var tr = trs[i]

if(tr.innerHTML.search(oTXT.value) == -1)

tr.style.display = 'none'

else

tr.style.display = ''

}

}

</script>

  </head>

<body>

     <form>

        <span>输入查询的关键字:</span>

  <input type="text" id="oTXT" />

  <input type="button" value="查找" onclick="chazhao()" />

    </form>

    <table border="1px" id="tab1" width="500">

        <thead>

        <tr>

            <td>姓名</td>

            <td>职位</td>

            <td>手机</td>

            <td>分机</td>

        </tr>

        </thead>

        <tbody>

        <tr>

            <td>111</td>

            <td>222</td>

            <td>333</td>

            <td>444</td>

        </tr>

        <tr>

            <td>589</td>

            <td>666</td>

            <td>777</td>

            <td>888</td>

        </tr>

        <tr>

            <td>567</td>

            <td>888</td>

            <td>999</td>

            <td>999</td>

        </tr>

        </tbody>

    </table>

  </body>

</html>

var input='这是一大段文本'

var keys=['这是','这里是','文本','一']

var prepareKeys=function(){

if(!prepareKeys.$map){

var map={}

var maxLength=0

for(var i=0i<keys.lengthi++){

map[keys[i]]=1

maxLength=Math.max(keys[i].length,maxLength)

}

prepareKeys.$map={

map:map,

length:maxLength

}

}

return prepareKeys.$map

}

var colorKeyword=function(str){

var info=prepareKeys()

var output=[]

while(str){

var sub=str.substring(0,info.length)

str=str.substring(info.length)

while(!info.map[sub]&&sub){

str=sub.charAt(sub.length-1)+str

sub=sub.slice(0,-1)

console.log(sub)

}

console.log('color',sub)

if(sub){

output.push('#',sub,'#')

}else{

output.push(str.charAt(0))

str=str.substring(1)

}

}

return output.join('')

}

colorKeyword(input)

filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。

注意: filter() 不会对空数组进行检测。

注意: filter() 不会改变原始数组。

| 参数 | 描述 |

| function(currentValue, index,arr) | 必须。函数,数组中的每个元素都会执行这个函数

函数参数:

| 参数 | 描述 |

| currentValue | 必须。当前元素的值 |

| index | 可选。当期元素的索引值 |

| arr | 可选。当期元素属于的数组对象 |

|

| thisValue | 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。

如果省略了 thisValue ,"this" 的值为 "undefined" |

首先回顾一下filter的作用:过滤数组中符合条件的元素

另外也可以用来过滤对象数组中符合条件的对象,eg:

|

目前比较常用的方法是使用ES6的set完成,eg:

结合map使用可以先过滤出符合条件的对象然后去除某些不需要的字段,比如:

简单讲filter就是一个数组过滤器,参数接收一个函数,数组的每一项经过函数过滤,返回一个符合过滤条件的新数组

函数接收三个参数: