文本行斑马条纹

背景知识： linear-gradient (opens new window)

      
        const pull = (arr, ...args) => {
          let argState = Array.isArray(args[0]) ? args[0] : args;
          let pulled = arr.filter((v, i) => !argState.includes(v));
          arr.length = 0;
          pulled.forEach(v => arr.push(v));
        };
        let myArray = ['a', 'b', 'c', 'a', 'b', 'c'];
        pull(myArray, 'a', 'c');
        console.log(myArray);
      
    

<style>
  .main-zebra-stripes {
    width: 100%;
  }
  .main-zebra-stripes pre {
    width: 100%;
    display: inline-flex;
    background: #f8f8f8;
    background-image: linear-gradient(rgba(18,18,18,.05) 50%, transparent 0);
    background-size: auto 48px;
    background-origin: content-box;
    font: 14px/24px Consolas, Monaco, monospace;
  }
  .main-zebra-stripes pre > code {
    display: inline-block;
    padding: 0;
    color: #34495e;
    background-color: transparent;
    font: inherit;
  }
</style>
<template>
  <div class="main-zebra-stripes">
    <pre>
      <code class="language-javascript">
        const pull = (arr, ...args) => {
          let argState = Array.isArray(args[0]) ? args[0] : args;
          let pulled = arr.filter((v, i) => !argState.includes(v));
          arr.length = 0;
          pulled.forEach(v => arr.push(v));
        };
        let myArray = ['a', 'b', 'c', 'a', 'b', 'c'];
        pull(myArray, 'a', 'c');
        console.log(myArray);
      </code>
    </pre>
  </div>
</template>

显示代码 复制代码 复制代码