<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> html { font-size: calc(100vw / 7.5) } div { font-size: 0.24rem; } </style> </head> <body> <div> 哈哈 </div> </body> <script> const workList = [{ No: 1, name: '起居:起床', start: '2019-8-22 09:21:49', end: '2019-8-22 10:01:23', finished: true }, { No: 2, name: '压疮预防:叩背', start: '2019-8-22 11:23:46', end: '2019-8-22 12:34:23' }, { No: 3, name: '服药:早', start: '2019-8-22 12:30:42', end: '2019-8-22 13:24:48', }, { No: 4, name: '清洁:洗头', start: '2019-8-22 13:01:45', end: '2019-8-22 14:23:56' } ]; let target = []; let currentWorkList = []; let currentTimeRange = null; workList.forEach((item, index) => { if (currentTimeRange === null) { currentTimeRange = { start: item.start, end: item.end } currentWorkList.push(item); } else { if ((item.start >= currentTimeRange.start && item.start <= currentTimeRange.end) || (item.end >= currentTimeRange.start && item.end <= currentTimeRange.end)) { currentWorkList.push(item); if (item.end > currentTimeRange.end) { currentTimeRange.end = item.end; } } else { target.push({ timeRange: currentTimeRange, workList: currentWorkList }); currentTimeRange = null; currentWorkList.splice(0, currentWorkList.length); } } }); </script> </html>