1、让数组中被搜索的值,至于顶部

  1. <script>
  2.         /* 让数组中被搜索的值,至于顶部 */
  3.         var arr= ["html","css","js","vue","react"]
  4.         /* ["js","html","css","vue","react"] */
  5.         $("#app").keyup( function(event){
  6.             if(event.keyCode==13){
  7.                 var value = $(this).val();
  8.                 if(arr.indexOf(value)!=-1){
  9.                     console.log(value)
  10.                     var index = arr.indexOf(value);
  11.                     arr.splice(index,1);
  12.                     arr.unshift(value);
  13.                     console.log(arr);
  14.                 }
  15.             }
  16.         })
  17.     </script>

2、历史搜索

  1. <script>
  2.         /* 1、获取输入框的值 */
  3.         var historys = [];
  4.         $("#app").keyup(function (event) {
  5.             if (event.keyCode == 13) {
  6.                 /* 2.将值添加到一个数组里面去 */
  8.                 var value = $(this).val();
  9.                 var template = `
  10.                        <button>${value}</button>
  11.                        `
  12.                 /* 只有数组中不包含输入的关键字才向数组添加 */
  13.                 if (value) {
  14.                     if (!historys.includes(value)) {
  15.                         historys.unshift(value);
  16.                         /* 3、渲染数据到页面 */
  17.                         $("#container").prepend(template)
  18.                         $(this).val("")
  19.                     } else {
  21.                         var index = historys.indexOf(value);
  23.                         var res = historys.splice(index, 1);
  24.                         historys.unshift(...res);
  25.                         console.log(historys)
  26.                         $("button").eq(index).remove();
  27.                         $("#container").prepend(template)
  28.                         $(this).val("")
  29.                     }
  30.                 }
  32.             }
  33.         })
  34.     </script>

3、处理数组

分别取出中的第一，第二元素形成新的数组

  1. var lists = [
  2.     ["html", "css", "js"],
  3.     ["vue", "react", "angular"],
  4.     ["java", "python", "ruby"]
  5. ];
  6. var outArr = [];
  7. for (var i = 0; i < lists.length; i++) {
  8.     outArr.push([]);
  9. }
  10. for (var k = 0; k < lists.length; k++) {
  11.     for (var j = 0; j < lists[k].length; j++) {
  13.         outArr[j].push(lists[k][j]);
  15.     }
  16. }
  17. console.log(outArr)
  18. /* 
  19. [["html","vue","java"]....]
  20.  */